node.js中使用socket.io的方法

使用Socket.IO在Node.js中建立实时双向通信的方法如下：

安装

在终端中使用npm安装socket.io模块：

npm install socket.io --save

服务端代码

在服务端的代码中，需要新建一个Socket.IO实例，然后监听客户端与服务端之间的通信。以下是一个使用Express框架的例子。

// 引入Express框架和Socket.IO模块
const express = require('express');
const app = express();
const http = require('http');
const server = http.createServer(app);
const io = require('socket.io')(server);

// 在服务端与客户端之间建立连接
io.on('connection', function(socket) {
    console.log('A user connected');

    // 监听客户端发送的消息
    socket.on('chat message', function(msg) {
        console.log('message: ' + msg);

        // 将消息广播给所有连接的客户端
        io.emit('chat message', msg);
    });

    // 在客户端与服务端之间断开连接
    socket.on('disconnect', function() {
        console.log('A user disconnected');
    });
});

// 启动服务器并监听端口
server.listen(3000, function() {
  console.log('listening on *:3000');
});

在上面的代码中，当服务端接收到客户端的连接请求时，就会触发connection事件。紧接着，服务端就监听客户端发送的chat message消息，并将消息发送给所有连接的客户端。当客户端与服务端之间断开连接时，就会触发disconnect事件。

客户端代码

在客户端代码中，需要新建一个Socket.IO实例，然后连接服务端。以下是一个使用jQuery的例子。

// 引入Socket.IO模块
const socket = io();

// 监听服务端发送的消息
socket.on('chat message', function(msg) {
    $('#messages').append($('<li>').text(msg));
});

// 监听表单的提交事件，向服务端发送消息
$('form').submit(function() {
    socket.emit('chat message', $('#m').val());
    $('#m').val('');
    return false;
});

在上面的代码中，当客户端连接服务端后，就会出发connection事件。客户端通过on方法来监听服务端发送的chat message事件，并将消息显示在页面上。当用户提交了表单后，就会通过emit方法向服务端发送消息。

示例

以下是一个完整的示例。通过这个聊天室，你可以在不同的浏览器窗口中实时地发送和接收消息。

服务端代码

// 引入Express框架和Socket.IO模块
const express = require('express');
const app = express();
const http = require('http');
const server = http.createServer(app);
const io = require('socket.io')(server);

// 在服务端与客户端之间建立连接
io.on('connection', function(socket) {
    console.log('A user connected');

    // 监听客户端发送的消息
    socket.on('chat message', function(msg) {
        console.log('message: ' + msg);

        // 将消息广播给所有连接的客户端
        io.emit('chat message', msg);
    });

    // 在客户端与服务端之间断开连接
    socket.on('disconnect', function() {
        console.log('A user disconnected');
    });
});

// 启动服务器并监听端口
server.listen(3000, function() {
    console.log('listening on *:3000');
});

客户端代码

<!DOCTYPE html>
<html>
<head>
    <title>Socket.IO Chat Example</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        #messages {
            list-style-type: none;
            margin: 10px 0;
            padding: 0;
        }

        #messages li {
            margin-bottom: 5px;
            font-size: 14px;
        }

        #messages li:last-child {
            margin-bottom: 0;
        }

        #message-form {
            margin-top: 10px;
        }

        #message-form input[type="text"] {
            width: 80%;
            height: 30px;
            margin-right: 10px;
            padding: 5px;
            font-size: 14px;
            border: 1px solid #ccc;
            border-radius: 5px;
        }

        #message-form button {
            width: 15%;
            height: 30px;
            font-size: 14px;
            border-radius: 5px;
            background-color: #0099ff;
            color: #fff;
            cursor: pointer;
        }
    </style>
</head>
<body>
    <ul id="messages"></ul>
    <form id="message-form">
        <input id="m" type="text" autocomplete="off"></input>
        <button>Send</button>
    </form>
    <script src="/socket.io/socket.io.js"></script>
    <script src="https://code.jquery.com/jquery-3.5.0.min.js"></script>
    <script>
      $(function () {
          const socket = io();

          // 监听服务端发送的消息
          socket.on('chat message', function(msg) {
              $('#messages').append($('<li>').text(msg));
          });

          // 监听表单的提交事件，向服务端发送消息
          $('form').submit(function() {
              socket.emit('chat message', $('#m').val());
              $('#m').val('');
              return false;
          });
      });
    </script>
</body>
</html>

在上面的示例中，服务端使用Express框架搭建HTTP服务器，并使用Socket.IO模块与客户端实现实时通信。客户端使用了jQuery库，并在网页中建立了一个聊天室的界面，在表单提交时将用户输入的消息发送给服务端，并在收到服务端的消息时将消息显示在页面上。

本站文章如无特殊说明，均为本站原创，如若转载，请注明出处：node.js中使用socket.io的方法 - Python技术站

node.js中使用socket.io的方法

安装

服务端代码

客户端代码

示例

服务端代码

客户端代码

相关文章