HTML5中的 WebSocket API 可以用于实现实时通信。WebSocket 是一种在单个 TCP 连接上进行全双工通信的协议,它可以在客户端和服务器之间建立一个持久连接,让双方能够直接发送和接收数据。
使用 WebSocket API 实现实时通信需要经过以下步骤:
const socket = new WebSocket("ws://localhost:8080");
socket.addEventListener("open", (event) => {
console.log("WebSocket 连接已建立");
});
socket.addEventListener("message", (event) => {
console.log(`接收到消息:${event.data}`);
});
socket.addEventListener("close", (event) => {
console.log("WebSocket 连接已关闭");
});
socket.addEventListener("error", (event) => {
console.error("WebSocket 连接出错");
});
socket.send("Hello, server!");
const WebSocket = require("ws");
const wss = new WebSocket.Server({ port: 8080 });
wss.on("connection", (ws) => {
console.log("WebSocket 连接已建立");
ws.on("message", (message) => {
console.log(`接收到消息:${message}`);
// 广播消息到所有连接的客户端
wss.clients.forEach((client) => {
if (client.readyState === WebSocket.OPEN) {
client.send(message);
}
});
});
ws.on("close", () => {
console.log("WebSocket 连接已关闭");
});
});
需要注意的是,WebSocket 连接需要在服务器端进行处理,因此需要使用服务器端的 WebSocket 库,如 Node.js 中的 ws 模块。同时,由于 WebSocket 是 HTML5 中新增的 API,因此需要在支持 HTML5 的浏览器中使用。