前言
Websocket 是一种新型的协议，可以在客户端和服务器之间建立实时的双向通信。与传统的 HTTP 请求不同，Websocket 可以实现服务器主动向客户端推送数据，而不需要客户端不断地发送请求。
在前端开发中，Websocket 可以用于实现实时聊天、实时通知等功能。本文将介绍如何使用 Node.js 和 Socket.io 实现 Websocket 实时通讯。
准备工作
在开始之前，我们需要安装 Node.js 和 Socket.io。
安装 Node.js 可以前往官网下载安装包，安装完成后在命令行中输入以下命令，查看 Node.js 是否安装成功：
node -v
安装 Socket.io 可以使用 npm（Node.js 的包管理工具），在命令行中输入以下命令进行安装：
npm install socket.io
实现过程
1. 创建服务器
首先，我们需要创建一个服务器来处理 Websocket 的连接请求。在 Node.js 中，可以使用 http 模块来创建一个 HTTP 服务器。以下是创建服务器的代码：
// javascriptcn.com 代码示例
const http = require('http');
const server = http.createServer((req, res) => {
res.writeHead(200, {'Content-Type': 'text/plain'});
res.end('Hello World\n');
});
server.listen(3000, () => {
console.log('Server running at http://localhost:3000/');
});在以上代码中，我们创建了一个 HTTP 服务器，并将其监听在本地的 3000 端口上。
2. 创建 Websocket 服务
接下来，我们需要使用 Socket.io 创建一个 Websocket 服务，以便客户端可以与服务器进行实时通讯。以下是创建 Websocket 服务的代码：
// javascriptcn.com 代码示例
const http = require('http');
const server = http.createServer();
const io = require('socket.io')(server);
io.on('connection', (socket) => {
console.log('a user connected');
});
server.listen(3000, () => {
console.log('Server running at http://localhost:3000/');
});在以上代码中，我们使用 Socket.io 创建了一个 Websocket 服务，并将其连接到之前创建的 HTTP 服务器上。当客户端与服务器建立连接时，会触发 connection 事件，我们可以在事件处理函数中监听这个事件，以便进行后续的处理。
3. 实现消息发送和接收
现在，我们已经创建了一个 Websocket 服务，接下来我们需要实现客户端和服务器之间的消息发送和接收。以下是实现消息发送和接收的代码：
// javascriptcn.com 代码示例
const http = require('http');
const server = http.createServer();
const io = require('socket.io')(server);
io.on('connection', (socket) => {
console.log('a user connected');
socket.on('chat message', (msg) => {
console.log('message: ' + msg);
io.emit('chat message', msg);
});
});
server.listen(3000, () => {
console.log('Server running at http://localhost:3000/');
});在以上代码中，我们创建了一个 chat message 事件，当客户端发送消息时，会触发这个事件。服务器会在事件处理函数中将消息打印出来，并使用 io.emit 方法将消息广播给所有连接到服务器的客户端。
客户端可以使用 Socket.io 的 emit 方法来发送消息，以下是客户端发送消息的代码：
// javascriptcn.com 代码示例
const socket = io();
$('form').submit(() => {
socket.emit('chat message', $('#m').val());
$('#m').val('');
return false;
});
socket.on('chat message', (msg) => {
$('#messages').append($('<li>').text(msg));
});在以上代码中，我们使用 Socket.io 的 emit 方法发送消息，并使用 on 方法监听服务器广播的消息。
总结
在本文中，我们介绍了如何使用 Node.js 和 Socket.io 实现 Websocket 实时通讯。通过本文的学习，读者可以了解 Websocket 的基本原理和使用方法，并可以将其应用到实际的项目中。
完整示例代码请见 GitHub。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65624474d2f5e1655dc2fd1c