服务器发送事件和浏览器限制

Question

我有一个侦听Server Sent Events的Web应用程序.当我在打开多个窗口的时候工作和测试时,事情不起作用,我多次朝着错误的方向猛击头脑:最终,我意识到问题是并发连接.

但是我测试的数量非常有限,即使我在Apache上运行测试(我知道,我应该使用node).

然后,我切换浏览器并注意到一些非常有趣的东西:显然Chrome将Server Sent Events连接限制为4-5,而Opera则没有.另一方面,Firefox连同4-5个连接后,拒绝加载任何其他页面.

这背后的原因是什么？限制仅适用于来自同一来源的SSE连接,或者如果我要测试从其他域打开它们,它是否会相同？我是否有可能滥用SSE,这实际上阻止了浏览器,或者这是一种已知的行为？它有什么办法吗？

Answer 1

这在所有浏览器中的工作方式是每个域获得有限数量的连接,并且限制对于整个应用程序是全局的.这意味着如果您打开一个用于实时通信的连接,则可以减少一个用于加载图像,css和其他页面的连接.最重要的是,您没有获得新选项卡或窗口的新连接,所有这些连接都需要共享相同数量的连接.这非常令人沮丧,但有充分的理由限制连接.几年前,所有浏览器的限制为2(基于(http://www.ietf.org/rfc/rfc2616.txt)HTTP1.1规范中的规则)但现在大多数浏览器使用4-10个连接一般.另一方面,移动浏览器仍然需要限制连接量以节省电池.

这些技巧可用:

1. 使用更多主机名.通过分配ex.www1.domain.com,www2.domain.com您获得每个主机名的新连接.这个技巧适用于所有浏览器.不要忘记更改cookie域以包含整个域(domain.com,而不是www.domain.com)
2. 使用网络套接字.Web套接字不受这些限制的限制,更重要的是它们不会与您的其他网站内容竞争.

3. 打开新选项卡/窗口时重用相同的连接.如果您已将所有实时通信逻辑收集到对象调用Hub,则可以在所有打开的窗口上调用该对象,如下所示:

   window.hub = window.opener ? window.opener.hub || new Hub()

4. 或使用闪存 - 这些天不是最好的建议,但如果不能选择websockets,它仍然可能是一个选项.
5. 请记住在每个SSE请求之间添加几秒钟的时间,以便在开始新的请求之前清除排队的请求.此外,每增加一个用户不活动的等待时间,这样您就可以将服务器资源集中在那些活跃的用户身上.还要添加一个随机数的延迟以避免雷鸣群问题

使用多线程和阻塞语言(如Java或C#)时要记住的另一件事是冒着使用长轮询请求中的资源而冒险使用其他应用程序所需的资源.例如,在C#中,每个请求都会锁定Session对象,这意味着在SSE请求处于活动状态期间整个应用程序都没有响应.

NodeJs对于这些东西很有用,原因很多,因为你已经想到了,如果你使用NodeJS,你会使用socket.io或engine.io来处理所有这些问题,使用websockets,flashsockets和XHR-polling并且因为它是非阻塞和单线程的,这意味着它在等待发送事件时将在服务器上消耗非常少的资源.AC#应用程序每个等待请求消耗一个线程,该线程至少需要2MB内存.

Answer 2

2022 年更新

此问题已在 HTTP/2 中得到修复。根据mozilla 文档：- 当不通过 HTTP/2 使用时，SSE 会受到最大打开连接数的限制，这在打开多个选项卡时尤其痛苦，因为该限制是针对每个浏览器的，并且设置得非常低数字（6）。

该问题在 Chrome 和 Firefox 中被标记为“无法修复”。此限制针对每个浏览器 + 域，这意味着您可以跨所有选项卡打开 6 个 SSE 连接，www.1.example以及另外 6 个 SSE 连接www.2.example（根据 Stackoverflow）。

使用 HTTP/2 时，同时 HTTP 流的最大数量在服务器和客户端之间协商（默认为 100）。

Spring Boot 2.1+默认情况下附带 Tomcat 9.0.x，在使用 JDK 9 或更高版本时，它支持开箱即用的 HTTP/2。

如果您使用任何其他后端，请启用 http/2 以解决此问题。

Answer 3

解决此问题的一种方法是关闭所有隐藏选项卡上的连接，并在用户访问隐藏选项卡时重新连接。

我正在使用一个唯一标识用户的应用程序，它允许我实现这个简单的解决方法：

1. 当用户连接到 sse 时，存储他们的标识符以及他们的选项卡加载时的时间戳。如果您当前未在您的应用中识别用户，请考虑使用会话和 cookie。

2. 当一个新选项卡打开并连接到 sse 时，在您的服务器端代码中，向与该标识符关联的所有其他连接（没有当前时间戳）发送一条消息，告诉前端关闭 EventSource。前端处理程序看起来像这样：

   myEventSourceObject.addEventListener('close', () => { myEventSourceObject.close(); myEventSourceObject = null; });

3. 使用 javascript 页面可见性 api 检查旧选项卡是否再次可见，如果是，则将该选项卡重新连接到 sse。

   document.addEventListener('visibilitychange', () => { if (!document.hidden && myEventSourceObject === null) { // reconnect your eventsource here } });

4. 如果您像步骤 2 描述的那样设置服务器代码，则在重新连接时，服务器端代码将删除与 sse 的所有其他连接。因此，您可以在选项卡之间单击，并且每个选项卡的 EventSource 只会在您查看页面时连接。

请注意，页面可见性 api 在某些旧浏览器上不可用：https : //caniuse.com/#feat=pagevisibility