Я пытаюсь опубликовать данные с датчика влажности на веб-сайте. Я использую Arduino для обновления и отправки данных в базу данных Firebase в реальном времени. Оттуда я использую Glitch.com для моего сайта. Я использую датчик влажности, и в моей базе данных есть переменная «Влажность», где значения хранятся и обновляются каждые 0,3 секунды. В настоящее время у меня есть следующий код:
HTML Файл
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="/styles.css">
<script src="https://www.gstatic.com/firebasejs/4.11.0/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/4.11.0/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/4.11.0/firebase-database.js"></script>
<script src="https://www.gstatic.com/firebasejs/4.11.0/firebase-firestore.js"></script>
<script src="https://www.gstatic.com/firebasejs/4.11.0/firebase-storage.js"></script>
<script src="https://www.gstatic.com/firebasejs/4.11.0/firebase-messaging.js"></script>
<script>
// Initialize Firebase
var config = {
apiKey: "xx",
authDomain: "xx",
databaseURL: "xx",
projectId: "xx",
storageBucket: "xx",
messagingSenderId: "xx",
appId: "xx"
};
firebase.initializeApp(config);
</script>
<script>
var database = firebase.database();
var ref = firebase.database().ref("plant-patrol/Moisture");
ref.once("value")
.then(function(snapshot) {
var key = snapshot.key; // "plant-patrol"
var childKey = snapshot.child("plant-patrol/Moisture").key; // "Moisture"
});
</script>
<script>
var ref = firebase.database().ref("plant-patrol/Moisture");
ref.on("value", function(snapshot) {
console.log(snapshot.val());
}, function (error) {
console.log("Error: " + error.code);
});
</script>
<script src="/script.js" defer></script>
</head>
</html>
JS Файл
auth.onAuthStateChanged(currentUser => console.log(currentUser));
auth.signInAnonymously();
* 1012 Я понятия не имею, что делает этот код JS, но я скопировал его из другого вопроса о переполнении стека.
Теперь, как указывалось ранее, путь в базе данных Firebase в реальном времени, который я хочу отобразить, - «Влага», это также единственные данные в базе данных. Я попытался немного возиться с детским ключом и снимком и попытался понять, что они на самом деле делают. К сожалению, я не смог отобразить данные в любой форме, даже в консоли.
Для строк чтения и записи в Firebase было установлено значение True, поскольку безопасность не имеет значения (школьный проект). Мне также было интересно, можно ли обновить данные на сайте, не обновляя sh страницу.
Обновление
Достигнут определенный прогресс, прочитайте мои комментарии ниже!