【发布时间】:2020-03-21 21:49:29
【问题描述】:
我在我的第一个 IoT 项目中使用湿度传感器。我将传感器中的数据保存在实时 Firebase 数据库中。对于我的网页,我使用的是 glitch.com,并且我试图在我的网页上显示来自数据库的数据。我尝试自己编写代码,但几乎无处可去。所以我决定重新混合现有的 glitch.com “Firebase Read”项目。但是我遇到了一个问题,它说:'firebase' not defined in the following 3 lines (在下面列出的第一行中,它也说没有定义配置):
firebase.initializeApp(config);
var rootRef = firebase.database().ref();
var myDBConn = firebase.database().ref("Moisture");
我的 js 文件中目前有以下内容:
<script src="https://www.gstatic.com/firebasejs/7.11.0/firebase.js"></script>
// Initialize Firebase
// TODO: Replace with your project's customized code snippet
// Initialize Firebase
var firebaseConfig = {
apiKey: "xx",
authDomain: "xx",
databaseURL: "xx",
projectId: "xx",
storageBucket: "xx",
messagingSenderId: "xx",
appId: "xx"
};
firebase.initializeApp(config);
var rootRef = firebase.database().ref();
// List to hold my moisture value
var myMoisture = [];
// Define database connection to correct branch, Moisture
var myDBConn = firebase.database().ref("Moisture");
// Function that acts when a 'new child is added to the DB' - i.e. new data is added this function runs.
myDBConn.on("child_added", function(data, prevChildKey){
// The data returned from the branch is put into a variable, dataPoint
var dataPoint = data.val();
// Convert the 'Temp' field from dataPoint into integers, then put them into the myTemps list
myMoisture.push(parseInt(dataPoint.Temp));
// Add all the Temps and get the total
var totalT = 0;
var i=0;
for (i=0; i<myMoisture.length; i++){
totalT += myMoisture[i];
}
// Create an average by dividing the sum of temps by the number of temps
var average = totalT / myMoisture.length;
// Update the page elements with the average and the last item (most recent) off the list
document.getElementById("averageT").innerHTML=average;
document.getElementById("LiveT").innerHTML=myMoisture[myMoisture.length - 1];
});
这在我的 HTML 文件中:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Hello!</title>
<!-- The core Firebase JS SDK is always required and must be listed first -->
<script src="https://www.gstatic.com/firebasejs/7.11.0/firebase.js"></script>
<script src="script.js"></script>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>Reading from Firebase Cloud Database</h1>
Live Moisture Reading: <a id="LiveT">---</a> <br>
Average Temperature: <a id="averageT">---</a>
</body>
</html>
这是由调试器显示的(我不知道这些信息是否相关以及它的含义,但也许它很有用):
Error: listen EADDRINUSE: address already in use :::3000
at Server.setupListenHandle [as _listen2] (net.js:1270:14)
at listenInCluster (net.js:1318:12)
at Server.listen (net.js:1405:7)
at Lws.listen (/opt/nvm/versions/node/v10.15.3/pnpm-global/1/node_modules/.registry.npmjs.org/lws/1.3.2/node_modules/lws/index.js:81:12)
at WsServe.execute (/opt/nvm/versions/node/v10.15.3/pnpm-global/1/node_modules/.registry.npmjs.org/lws/1.3.2/node_modules/lws/lib/command/serve.js:296:26)
at WsServe.execute (/opt/nvm/versions/node/v10.15.3/pnpm-global/1/node_modules/.registry.npmjs.org/local-web-server/2.6.0/node_modules/local-web-server/lib/command/serve.js:11:18)
at Map.start (/opt/nvm/versions/node/v10.15.3/pnpm-global/1/node_modules/.registry.npmjs.org/cli-commands/0.4.0/node_modules/cli-commands/index.js:26:18)
at WsCliApp.start (/opt/nvm/versions/node/v10.15.3/pnpm-global/1/node_modules/.registry.npmjs.org/lws/1.3.2/node_modules/lws/lib/cli-app.js:9:26)
at Function.run (/opt/nvm/versions/node/v10.15.3/pnpm-global/1/node_modules/.registry.npmjs.org/lws/1.3.2/node_modules/lws/lib/cli-app.js:15:29)
at Object.<anonymous> (/opt/nvm/versions/node/v10.15.3/pnpm-global/1/node_modules/.registry.npmjs.org/local-web-server/2.6.0/node_modules/local-web-server/bin/cli.js:5:29)
接下来我可以尝试什么?
【问题讨论】:
-
错误 Error: listen EADDRINUSE: address already in use :::3000 表示您尝试使用的 PORT 上已经有东西在运行。
-
嗯,有趣,我会研究一下,谢谢!
标签: javascript html firebase firebase-realtime-database