Question

我正在写一个非常简单的应用程序（现在），我需要在div中记录每个连接和断开连接。目前我可以使用我的代码记录我的控制台上的每个连接和断开连接，但是我对socket.io的知识有限，我无法弄清楚如何在我的index.html文件中的div中记录它们即我需要server.js发出（？）连接和断开连接并将它们附加到div而不是仅仅在我的控制台上记录它们。我包含了我的server.js文件和我的html文件（包含客户端脚本）。

我的server.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');
});

io.on('connection', function (socket) {
    ID = socket.id;
    console.log('client id - ' + socket.id + ' connected.');
    socket.on('disconnect', function() {
        console.log('client id - ' + socket.id + ' disconnected.')})

})



server.listen(80, '95.211.186.223', function () {
    console.log("Listening on 80")
});

我的index.html

<!doctype html>  
<html lang="en">  
<head></head>
<body>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.3/socket.io.js"></script>    
    <script>  
        var socket = io.connect('http://95.211.186.223:80');
        socket.on('connect', function(data) {
            console.log('ID: ' + socket.id)
         });
    </script>   

    <div id="log"></div>
</body>
</html>

Answer 1

有很多方法可以实现这一点。只是其中之一：

在服务器上：

io.on('connection', function (socket) {
    ID = socket.id;
    console.log('client id - ' + socket.id + ' connected.');
    io.sockets.emit('connect_event', data);     
})

io.on('disconnect', function() {
    ID = socket.id;
    console.log('client id - ' + socket.id + ' disconnected.');
    io.sockets.emit('disconnect_event', data);
}

如果您想知道如何向所有人发送消息see the relevant question.

在客户端：

function addText(eventType) {
    var p = document.createElement('p');
    p.innerHTML = 'ID: ' + socket.id  + ' ' + eventType;
    document.body.appendChild(p);
}
socket.on('connect_event', function(data) {
    addText('connected')
});
socket.on('disconnect_event', function(data) {
    addText('disconnected')
});

使用socket.io记录连接和断开连接

1 个答案: