在网站上显示来自 DB 的值变化答案

【问题标题】：Display value change from DB on webstie在网站上显示来自 DB 的值变化
【发布时间】：2020-04-10 03:24:29
【问题描述】：

我有一个带有传感器（加速器）的 arduino，它将单个值发送到我的数据库。该值随着移动而增加 1。

我设法在我的控制台日志中显示了这个值。但是当它增加时它不会更新。我确实有一个功能可以做到这一点，但它需要来自客户端的用户交互。

我想知道当它在数据库中时，是否有可能以一种或另一种方式在 webbage 上更改此值？

这是我的代码：

Javascript：

//gets the value from the DB and displays it on my webpage
firebase.database().ref('Reps').once('value').then (function(snapshot){
    WemosGet = snapshot.val().Value;
    document.getElementById("progressList").innerHTML=WemosGet;
    console.log(WemosGet);

})

HTML：

<p>Repetitions left: <br><strong id="progressList"></strong></p></strong></p>

我之前尝试过的，与用户 onaction：

output.innerHTML = slider.value
    update=()=>{
        output.innerHTML = slider.value; 
        // Display the default slider value
        console.log(slider.value)
        setAmount = slider.value;
    }

// Update the current slider value (each time you drag the slider handle)
slider.addEventListener('input', update);

所以，我想让它在例如事件监听器检测到值已更改（递增）时更新。这会以类似的方式工作吗？什么是最好的方法？即时通讯不知所措。

【问题讨论】：

标签： javascript html firebase firebase-realtime-database arduino

【解决方案1】：

使用on('value') 而不是once('value') 将侦听器附加到查询，以便每次查询中的数据发生更改时都会调用它。 once() 只获取一次数据。我建议阅读 documentation 以了解其工作原理。

【讨论】：

【解决方案2】：

您可以使用具有定时间隔的 AJAX 来查询数据库（或使用 Websocket 消息来更新需要更多资源来实现的页面）。

【讨论】：