Question

我正在使用node.js，html，JS和UDP通信。

我的node.js服务器上收到了一个号码（RC汽车的速度），并希望在我的网页上将其显示为动态更新号码。

现在我在socket.io的网页上显示它，但只有刷新页面才会更新数字。

node.js函数：

function disp_speed(message){
    var speedObj = JSON.parse(message);
    var spd = speedObj.value;
    console.log(spd);
    io.on('connection', function(socket) {
        socket.send(spd);
    });
}

html代码：

<p><b>Current Speed:</b> </p>  <p id="speed"></p>

<script>
   var socket = io();
   socket.on('message', function(data){
    document.getElementById("speed").innerHTML = data;
   });
</script>

如何编辑此代码以动态更新数字，而不是只更新刷新页面？

Answer 1

io.on('connection', function(socket) {
    socket.send(spd);
});

这意味着无论何时套接字重新连接（您更新页面），新数据都会发送到客户端。每当值更新时，您都需要这样做，例如：

var speed = 0;

function disp_speed(message){
   var speedObj = JSON.parse(message);
   speed = speedObj.value;
   //propagate update to all sockets
   io.emit("speed", speed);
}

io.on('connection', function(socket) {
    socket.emit("speed", speed);
});

在客户端：

socket.on("speed", speed => document.getElementById("speed").textContent = speed);

动态更新node.js中收到的网页上的数字？

1 个答案: