js实现长连接
使用 WebSocket 实现长连接
WebSocket 是 HTML5 提供的一种在单个 TCP 连接上进行全双工通信的协议，适合实现长连接。
创建 WebSocket 连接：
const socket = new WebSocket('ws://your-server-url');
socket.onopen = function() {
console.log('连接已建立');
socket.send('Hello Server!');
};
socket.onmessage = function(event) {
console.log('收到消息: ' + event.data);
};
socket.onclose = function() {
console.log('连接已关闭');
};
socket.onerror = function(error) {
console.log('发生错误: ' + error);
};使用 Server-Sent Events (SSE)
SSE 是 HTML5 的另一种技术，允许服务器向客户端推送数据。
客户端实现：
const eventSource = new EventSource('/sse-endpoint');
eventSource.onmessage = function(event) {
console.log('收到消息: ' + event.data);
};
eventSource.onerror = function() {
console.log('连接错误');
};使用轮询(Polling)模拟长连接
虽然效率较低，但可以在不支持 WebSocket 或 SSE 的环境中使用。
function poll() {
fetch('/poll-endpoint')
.then(response => response.json())
.then(data => {
console.log('收到数据: ', data);
setTimeout(poll, 5000); // 5秒后再次轮询
});
}
poll();使用长轮询(Long Polling)
长轮询是传统轮询的改进版本，服务器在有数据时才响应。
function longPoll() {
fetch('/long-poll-endpoint')
.then(response => response.json())
.then(data => {
console.log('收到数据: ', data);
longPoll(); // 立即开始下一次请求
});
}
longPoll();使用第三方库
Socket.IO 是一个流行的库，封装了 WebSocket 和其他实时通信技术。
安装 Socket.IO：
npm install socket.io-client使用示例：
import io from 'socket.io-client';
const socket = io('http://your-server-url');
socket.on('connect', () => {
console.log('已连接');
});
socket.on('message', (data) => {
console.log('收到消息: ', data);
});
socket.emit('send-message', { text: 'Hello' });注意事项
WebSocket 和 SSE 需要服务器端支持，确保服务器已配置相应的端点。
考虑添加心跳机制来保持连接活跃，防止因超时而断开。
在生产环境中应添加错误处理和重连逻辑，提高可靠性。
对于现代浏览器，WebSocket 通常是首选方案，因为它提供最低的延迟和最高的效率。
