什么是 Server-sent Events
Server-sent Events（SSE）是一种基于 HTTP 的服务器推送技术，可以让服务器向客户端推送实时数据。与 WebSockets 不同，SSE 建立在 HTTP 协议之上，因此可以使用普通的 HTTP 端口（80 或 443）进行通信，不需要特殊的协议或端口。
SSE 的工作方式是客户端向服务器发送一个 HTTP 请求，服务器在响应中返回一系列事件流。客户端通过监听事件流，即可接收到服务器推送的实时数据。
兼容性问题
SSE 是一项比较新的技术，目前仅在最新版本的浏览器中得到完整支持。以下是 SSE 在不同浏览器中的支持情况：
- Chrome：完整支持
- Firefox：完整支持
- Safari：完整支持
- Edge：完整支持
- Internet Explorer：不支持
由于 Internet Explorer 不支持 SSE，因此在开发过程中需要考虑兼容性问题。
解决方法
为了兼容 Internet Explorer，我们需要使用另一种技术——长轮询（Long Polling）。长轮询的工作方式与 SSE 类似，客户端向服务器发送一个 HTTP 请求，服务器在响应中返回实时数据，但是客户端在收到响应后不会立即关闭连接，而是保持连接打开状态，直到下一个请求到达或者超时。
以下是使用长轮询实现实时数据推送的示例代码：
-- -------------------- ---- -------
-------- ------------- -
----- --- - --- -----------------
--------------- ------------ ------
---------------------- - ---------- -
-- --------------- --- - -- ---------- --- ---- -
----- ---- - -----------------
-- -------
- ---- -
----------------------- ------ -- -- - --------
-
--
-----------
-
--------------在服务器端，我们需要实现一个接口来返回实时数据。以下是使用 Node.js 和 Express 实现的服务器端代码示例：
-- -------------------- ---- -------
----- ------- - -------------------
----- --- - ----------
-------------------- ----- ---- -- -
------------------ -
--------------- --------------------
---------------- -----------
------------- ------------
---
-------------- -- -
---------------- ----- ----------------------------
-- ------
---
---------------- -- -- -
------------------- ------- -- ---- -------
---在上面的代码中，我们使用 res.write 方法向客户端发送实时数据。注意，在发送数据时需要在每行末尾添加两个换行符，这是 SSE 协议的要求。
总结
Server-sent Events 是一项非常有用的技术，可以让我们轻松地实现实时数据推送。但是由于其兼容性问题，我们需要使用长轮询来兼容不支持 SSE 的浏览器。在实现长轮询时，需要注意在每行末尾添加两个换行符，以满足 SSE 协议的要求。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6627b45bc9431a720c46a154