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

Question

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

然而，我测试的数量非常有限，即使我在Apache上运行测试（我知道，我应该使用节点）。

然后，我转换浏览器并注意到一些非常有趣的内容：显然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. 使用网络套接字。网络套接字不受这些限制的限制，更重要的是，它们不会与其他网站内容竞争。

3. 打开新标签/窗口时重复使用相同的连接。如果您已将所有实时通信逻辑收集到对象调用Hub，则可以在所有打开的窗口上调用该对象，如下所示：

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

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

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

NodeJs很适合这些事情，原因很多，因为你已经想出了，如果你使用的是NodeJS，你可以使用socket.io或engine.io来解决所有这些问题，方法是使用websockets，flashsockets和XHR轮询，也因为它是非阻塞和单线程的，这意味着它在等待发送内容时将在服务器上消耗非常少的资源。 C＃应用程序每个等待请求占用一个线程，该线程至少占用2MB内存。

Answer 2

您对同时连接的数量是正确的。

您可以在此列表中查看最大值：http://www.browserscope.org/?category=network

不幸的是，除了多路复用和/或使用不同的主机名之外，我从未找到任何解决方法。

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