当前位置：首页 > JavaScript

js comet实现

2026-03-14 19:30:58JavaScript

Comet 技术简介

Comet 是一种基于 HTTP 长连接的服务器推送技术，允许服务器实时向客户端推送数据，而不需要客户端频繁发起请求。这种技术常用于实现实时更新的应用，如聊天室、股票行情等。

使用 JavaScript 实现 Comet

以下是几种常见的 Comet 实现方式：

长轮询（Long Polling）

长轮询是 Comet 的一种常见实现方式。客户端发起请求后，服务器保持连接打开，直到有数据可发送或超时。

function longPolling() {
    fetch('/comet-endpoint')
        .then(response => response.json())
        .then(data => {
            console.log('Received data:', data);
            longPolling(); // 立即发起下一次请求
        })
        .catch(error => {
            console.error('Error:', error);
            setTimeout(longPolling, 5000); // 错误时延迟重试
        });
}

longPolling(); // 启动长轮询

服务器发送事件（Server-Sent Events, SSE）

SSE 是 HTML5 提供的标准 API，用于实现服务器向客户端的单向通信。

const eventSource = new EventSource('/comet-endpoint');

eventSource.onmessage = function(event) {
    console.log('Received data:', event.data);
};

eventSource.onerror = function(error) {
    console.error('Error:', error);
    eventSource.close();
    setTimeout(() => new EventSource('/comet-endpoint'), 5000); // 错误时重连
};

WebSocket

WebSocket 是双向通信协议，虽然不属于传统 Comet 技术，但可以实现类似功能。

const socket = new WebSocket('ws://your-server/comet-endpoint');

socket.onmessage = function(event) {
    console.log('Received data:', event.data);
};

socket.onerror = function(error) {
    console.error('Error:', error);
    socket.close();
};

socket.onclose = function() {
    setTimeout(() => new WebSocket('ws://your-server/comet-endpoint'), 5000);
};

服务器端实现示例（Node.js）

以下是使用 Node.js 和 Express 实现长轮询的简单示例：

js comet实现

const express = require('express');
const app = express();

app.get('/comet-endpoint', (req, res) => {
    // 模拟数据更新
    const dataUpdated = Math.random() > 0.5;

    if (dataUpdated) {
        res.json({ message: 'New data available', data: Date.now() });
    } else {
        // 保持连接打开，直到超时（默认约 2 分钟）
        setTimeout(() => {
            res.json({ message: 'No new data', data: null });
        }, 30000); // 30 秒超时
    }
});

app.listen(3000, () => console.log('Server running on port 3000'));