SSE（Server-Sent Events）是一种服务器向客户端推送数据的技术，不需要客户端发送请求，可以实时的向客户端推送最新的数据，这种技术在 Web 开发中也有广泛应用。本文将讨论 SSE 在浏览器中的支持情况，以及对应的问题与解决方案。
浏览器支持情况
SSE 的浏览器支持情况非常广泛，如下表所示：
| 浏览器 | 版本 |
|---|---|
| Chrome | 6+ |
| Edge | 12+ |
| Firefox | 6+ |
| Internet Explorer | 不支持 |
| Opera | 11.50+ |
| Safari | 5+ |
可以看出，只有 Internet Explorer 不支持 SSE，其他主流浏览器均可以使用。
对应的问题与解决方案
虽然支持 SSE 的浏览器大多数都是现代浏览器，但是在使用的过程中还是会遇到一些问题，下面将分别讨论这些问题及其解决方案。
1. 未支持的浏览器
在未支持 SSE 的浏览器中，我们可以采用长轮询技术这种方式来替代 SSE。这种方式可以实现类似的功能，不过是通过客户端向服务器不断发送请求的方式来实现的。具体实现方式可参考以下代码：
-- -------------------- ---- -------
-------- ------ -
--- --- - --- -----------------
--------------- -------------------------- ------
---------------------- - ---------- -
-- --------------- --- -- -
-- ----------- --- ---- -
-- ------
---------------------------------
-
-------
-
--
-----------
-
-------这段代码会不断向服务器发送请求，并在收到响应后再次发送请求。
2. 断线重连
由于网络不稳定等原因，连接可能会在超时后断开。为了实现断线重连，我们可以在客户端向服务器发送连接请求时，将连接的 ID 或连接的时间戳发送给服务器，服务器收到连接请求时，可以记录当前连接的 ID 或时间戳，通过这些信息可以轻松实现断线重连。具体实现方式可参考以下代码：
-- -------------------- ---- -------
-- --------------- -- ----
--- ----------- - --- ------------------------------------------------
-- -------------- -- ----
--- ----------- - --- ------
----------------- ----------------- ------- ----- -
--- ------------ - ---------------------------
----------------------------- --------
-- ---
---
-- ---------------- -- ------------
------------------------------------- --------------- -
-- ------------------------ --- ------------------- -
--- ------------ - --------------------------
--- -------------- - --- ------------------------------------------- - --------------
-- ---
-
---这段代码在客户端向服务器发送连接请求时携带了连接 ID 或时间戳，在服务器收到连接请求时，将连接 ID 或时间戳记录下来，当连接断开后，可以使用记录的连接 ID 或时间戳重新连接服务器，从而实现断线重连。
3. 对 SSE 的部分支持
在某些情况下，浏览器可能只对 SSE 的部分功能进行支持，比如不支持 retry 字段。对于这种情况，我们需要在使用 SSE 时谨慎选择使用的功能，在不同的浏览器上进行测试，并编写相应的兼容性代码。
总结
本文讨论了 SSE 在浏览器中的支持情况，以及对应的问题与解决方案。尽管 SSE 的浏览器支持情况较好，但仍有一些问题需要注意，希望本文能够对大家有所启发。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64c4b1c483d39b48818252a6