当前位置：首页 > news >正文

SSE单向消息推送(get请求)

news 来源：原创 2025/5/14 5:51:58

应用场景

实时通知：社交媒体平台可以使用SSE向用户推送新消息、评论和点赞等通知。
股票价格更新：金融应用程序可以使用SSE实时更新股票价格和市场数据。
实时聊天：对于一些简单的单向消息推送，如系统通知或公告的实时推送，SSE也是一个不错的选择。

基本使用

创建EventSource对象：使用EventSource构造函数创建一个新的EventSource对象，指定要连接的服务器端URL。例如：

const eventSource = new EventSource('http://88.5.7.139:3001/stream');
eventSource.onmessage = function(event) {
    console.log("data", event.data)
    // const data = JSON.parse(event.data);
    // 在这里处理数据，例如更新页面内容或执行其他操作
};
eventSource.onerror = function(event) {
    if (event.readyState === EventSource.CLOSED) {
        // 处理连接关闭的情况，例如显示错误信息或重新连接
        console.log('Connection closed.');
    } else {
        // 处理其他错误，例如网络问题
        console.error('EventSource error:', event);
    }
};
//关闭连接
eventSource.close();

自定义事件

服务器发送自定义事件：在服务器端发送数据时，可以指定event字段来定义自定义事件类型。例如

event: customEvent
data: { "message": "This is a custom event" }

前端监听自定义事件：在前端使用addEventListener方法监听自定义事件。例如：

eventSource.addEventListener('customEvent', function(event) {
    console.log('Custom event received:', event.data);
});

注意事项

结束标识：服务器端应发送特定的标识来表示数据流的结束，然后前端调用close关闭EventSource。
只支持GET：EventSource请求只支持GET方法，如果要传输复杂的请求体，可以考虑两次请求的方案。
不支持自定义Header：如果接口需要鉴权，无法在Header里定义Authorization请求头，那么建议使用Cookie来标识用户，EventSource请求会携带Cookie。