关于socket.io实时文本显示的问题

Issue about socket.io real-time text display

本文关键字：显示 问题 文本 实时 socket io 关于      更新时间：2023-09-26

我正在尝试使用node.js和socket.io库在客户端和服务器之间建立websocket连接。服务器将每秒生成一个随机数，并发出一个允许客户端检测的事件。

问题是客户端（网页）可以检测到事件并显示服务器发送的随机数，但不是实时的。为了显示一个新的随机数，我不得不刷新浏览器。我希望客户端实时显示随机数，但我不知道为什么我的websocket应用程序看起来不是实时的。

服务器（main.js）源代码：

var app = require('express')();
var server = require('http').Server(app);
var io = require('socket.io')(server);
app.get('/', function(req, res){                  
    res.sendFile(__dirname + '/index.html');
});
randomNum();
function randomNum(){
    io.on('connection', function(socket){
        socket.emit('random', Math.floor((Math.random() * 100) + 1));
    });
    setInterval(randomNum, 1000);
}
server.listen(8080);

客户端（index.html）源代码：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Websocket</title>
<script src="/socket.io/socket.io.js"></script>
<script>
var socket = io();
socket.on('random', function(data){
    document.getElementById("displayNum").innerHTML = data;
});
</script>
</head>
<body>
<p id="displayNum"></p>
</body>
</html>

你不应该这样做：

function randomNum(){
    io.on('connection', function(socket){
        socket.emit('random', Math.floor((Math.random() * 100) + 1));
    });
    setInterval(randomNum, 1000);
}

你每1秒设置一次io.on连接。你应该制作一个函数来发射你的随机，并在这个函数之外设置区间

相关文章：