js实现长连接
使用 WebSocket 实现长连接
WebSocket 是 HTML5 提供的一种全双工通信协议,适合实现长连接。
客户端代码示例
const socket = new WebSocket('ws://your-server-url');
socket.onopen = () => {
console.log('连接已建立');
socket.send('Hello Server!');
};
socket.onmessage = (event) => {
console.log('收到消息:', event.data);
};
socket.onclose = () => {
console.log('连接已关闭');
};
socket.onerror = (error) => {
console.error('连接错误:', error);
};
服务端代码示例(Node.js + ws 库)
const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 8080 });
wss.on('connection', (ws) => {
console.log('客户端已连接');
ws.on('message', (message) => {
console.log('收到消息:', message.toString());
ws.send('Server Response');
});
ws.on('close', () => {
console.log('客户端已断开');
});
});
使用 Server-Sent Events (SSE)
SSE 是一种服务器推送技术,适合单向长连接场景(如实时通知)。
客户端代码示例
const eventSource = new EventSource('http://your-server-url/sse');
eventSource.onmessage = (event) => {
console.log('收到消息:', event.data);
};
eventSource.onerror = (error) => {
console.error('SSE 错误:', error);
};
服务端代码示例(Node.js + Express)
const express = require('express');
const app = express();
app.get('/sse', (req, res) => {
res.setHeader('Content-Type', 'text/event-stream');
res.setHeader('Cache-Control', 'no-cache');
res.setHeader('Connection', 'keep-alive');
const interval = setInterval(() => {
res.write(`data: ${new Date().toISOString()}\n\n`);
}, 1000);
req.on('close', () => {
clearInterval(interval);
});
});
app.listen(3000, () => console.log('Server running on port 3000'));
使用轮询(Polling)模拟长连接
轮询是一种简单但低效的长连接替代方案,通过定时请求实现。
客户端代码示例
function pollServer() {
fetch('http://your-server-url/poll')
.then(response => response.json())
.then(data => {
console.log('收到数据:', data);
setTimeout(pollServer, 1000); // 1秒后再次请求
});
}
pollServer();
服务端代码示例(Node.js + Express)
app.get('/poll', (req, res) => {
res.json({ data: 'Polling response', timestamp: Date.now() });
});
注意事项
- WebSocket 适合双向实时通信(如聊天室),但需要服务端支持。
- SSE 适合服务器单向推送(如新闻更新),兼容性较好。
- 轮询 简单但浪费资源,仅适用于低频场景。
- 长连接需处理断线重连和心跳机制(如 WebSocket 定时发送 ping/pong)。






