Socket.io not changing HTML



在我的节点应用中,我使用socket.io将文本发送到客户端。我可以看到文本已成功发送从服务器发送到客户端,但在我的客户端jQuery文件中,socket.io没有更新我的html。

server.js:

const app = express();
const server = app.listen(3000, () => {
    console.log(`Web server up on port ${port}`);
});
let io = require('socket.io').listen(server);
io.on('connection', function(socket) {
  console.log('Connected socket!');
});
app.post('/findbrokenlinks', (req, res) => {
    ...
    // here i'm iterating through an array of links and if they are broken, I'm sending them to the client side
    links.forEach( (linkUrl) => {
        if (isBroken(linkUrl)) {
            io.sockets.emit("result", linkUrl);
        }
    }
}

index.js:

var socket = io('ws://localhost:3000', {transports: ['websocket']});
socket.on("result", function (data) {
    console.log(data);
    $('#results').append($('<p>').text(data));
});

index.hbs:

<div id="results">
</div>

在我的节点控制台和JavaScript客户端控制台中,我都可以看到信息已经交换。但是我的网页被卡在加载上,没有显示我更新的results Div。

这是我的客户端控制台(Safari Inspect Element(的样子:

[Log] https://gmail.com/deadlink (server.js, line 74)
[Log] https://www.facebook.com/awg;alwmg;lawkg (server.js, line 74)
[Log] https://github.com/alwfl (server.js, line 74)
> Selected Element
< <div id="results">
<p>https://gmail.com/deadlink</p>
<p>https://www.facebook.com/awg;alwmg;lawkg</p>
<p>https://github.com/alwfl</p>
</div>

我弄清楚了。现在,我的网页通过添加此代码来实时更新:

const app = express();
const server = app.listen(3000, () => {
    console.log(`Web server up on port ${port}`);
});
let io = require('socket.io').listen(server);
io.on('connection', function(socket) {
  console.log('Connected socket!');
});
app.post('/findbrokenlinks', (req, res) => {
    ...
    // here i'm iterating through an array of links and if they are broken, I'm sending them to the client side
    for each (linkUrl in links) {
        if (isBroken(linkUrl)) {
            io.sockets.emit("result", linkUrl);
        }
    }
    res.redirect('/findbrokenlinks'); // ADD THIS LINE !!
}

如果我从您以前的评论中正确理解,则仅在服务器接收到发布请求时才会发生"搜索破碎链接"的迭代,因此很可能没有实时更新无论如何。但是,如果此行为的目的是,您需要调用res.end(),因为您没有调用res.send()发送数据。

最新更新