解决 Firefox 浏览器下 Server-sent Events 失效问题

前言

在 Web 开发中，有时需要从服务器向客户端推送实时消息，这时候可以使用 WebSockets、Polling 或者 Server-sent Events。其中 Server-sent Events 是一种推送技术，可以在客户端与服务器之间创建长时间的连接，实现实时的数据推送。

然而，在 Firefox 浏览器下，会出现 Server-sent Events 失效的情况，本文将介绍其原因及解决方案。

问题描述

当使用 Firefox 浏览器（版本 52 及以下）访问使用 Server-sent Events 技术的网站时，会发现无法接收到服务器推送的实时消息，代码也没有任何报错。

原因分析

根据官方文档 MDN Web Docs 给出的解释，是由于 Firefox 浏览器对于不安全的 SSL/TLS 证书默认是不信任的，而默认使用的是 HTTPS 协议。后来，Firefox 52 版本又默认关闭了支持 HTTP/2 协议的 Option 协议。

因此，如果使用了不安全的 SSL/TLS 证书，并且默认使用的是 HTTPS 协议，那么就会导致 Server-sent Events 失败。

解决方案

方法一：使用相对路径

可以让客户端主动发起请求，使用相对路径请求服务器上的资源，避免遇到 SSL/TLS 证书不可信的问题。示例如下：

const es = new EventSource('/stream')

方法二：使用不带 SSL 的 HTTP 协议

如果没有 SSL/TLS 证书，也可以使用 HTTP 协议进行连接，但该方法不建议在生产环境中使用。

示例如下：

const es = new EventSource('http://example.com/stream')

方法三：SSL/TLS 证书可信

如果使用了 SSL/TLS 证书，可以将其添加到可信任证书中，或者使用经过认证的证书颁发机构（CA）签发的证书。

总结

本文介绍了 Firefox 浏览器下 Server-sent Events 失效问题的原因以及解决方案。在遇到此类问题时，可以根据具体情况选择相应的处理方法。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/650067b295b1f8cacde8ce04