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

【问题标题】：Server sent events and browser limits服务器发送事件和浏览器限制
【发布时间】：2019-06-18 21:54:40
【问题描述】：

我有一个监听服务器发送事件的 Web 应用程序。当我在打开多个窗口的情况下工作和测试时，一切都没有工作，我撞了好几次头，朝错误的方向看：最终，我意识到问题出在并发连接上。

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

然后，我切换浏览器并注意到一些非常有趣的事情：显然 Chrome 将服务器发送事件连接限制为 4-5，而 Opera 则没有。另一方面，Firefox 在 4-5 个同时连接后，拒绝加载任何其他页面。

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

【问题讨论】：

在 Windows 中，这是由 IE、chrome 和 firefox 尊重的注册表设置控制的，它限制所有连接，而不仅仅是 SSE。我对 websockets 也有同样的问题......你无法弥补......

标签： javascript google-chrome cross-browser opera server-sent-events

【解决方案1】：

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

这些技巧可用：

使用更多主机名。通过分配 ex。 www1.domain.com, www2.domain.com 你会为每个主机名获得新的连接。这个技巧适用于所有浏览器。不要忘记更改 cookie 域以包含整个域（domain.com，而不是 www.domain.com）
使用网络套接字。 Web 套接字不受这些限制，更重要的是，它们不会与您网站的其他内容竞争。
打开新标签页/窗口时重复使用相同的连接。如果您已将所有实时通信逻辑收集到对象调用集线器，您可以在所有打开的窗口上调用该对象，如下所示：

window.hub = window.opener ? window.opener.hub || new Hub()
或使用 flash - 这些天不是最好的建议，但如果 websockets 不是一个选项，它可能仍然是一个选项。
请记住在每个 SSE 请求之间添加几秒钟的时间，以便在开始新的请求之前清除排队的请求。还要为用户处于非活动状态的每一秒增加一点等待时间，这样您就可以将服务器资源集中在那些处于活动状态的用户上。还要添加一个随机数的延迟以避免Thundering Herd Problem

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

NodeJs 非常适合这些事情，原因有很多，你已经知道了，如果你使用 NodeJS，你会使用 socket.io 或 engine.io，通过使用 websockets、flashsockets 和XHR 轮询，也因为它是非阻塞和单线程的，这意味着它在等待发送内容时将在服务器上消耗很少的资源。 C# 应用程序在每个等待请求中消耗一个线程，仅用于线程就占用了至少 2MB 的内存。

【讨论】：

很好的答案！你知道为什么 Firefox 拒绝打开任何其他域吗？
谢谢；不幸的是，window.opener 技巧只适用于我从我的应用程序创建的子窗口；不适用于用户自己打开的任何选项卡。一旦用户打开太多标签，我就完蛋了……你知道是否有办法检查我们是否即将耗尽所有打开的连接？
尝试使用 (window.parent || window.opener) 来处理这两种情况。另请查看用于发送交叉表消息的 postMessage 方法。我认为没有任何方法可以查看连接数量，但您应该使用 timeout 属性来应对长轮询请求暂停其他请求的情况。 xhr = 新的 XMLHttpRequest(); xhr.timeout = 5000; xhr.ontimeout=timeoutFired;
Sunyatasattva - 是的 - 包括所有连接 - 甚至是新页面。这意味着如果您有四个打开的选项卡，每个选项卡都有自己的长轮询连接，那么您已经使用了所有连接，并且由于长轮询请求将发送到同一个域，因此该域的全局限制已用尽。防止这种情况的最佳方法是为长轮询连接（或重用连接）使用单独的域，这意味着普通页面加载不会受到影响 - 只是实时连接。
如果您满意，请将此标记为答案？

【解决方案2】：

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

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

当用户连接到 sse 时，存储他们的标识符以及标签加载时间的时间戳。如果您目前没有在应用中识别用户，请考虑使用会话和 Cookie。
当一个新选项卡打开并连接到 sse 时，在您的服务器端代码中，向与该标识符关联的所有其他连接（没有当前时间戳）发送一条消息，告诉前端关闭 EventSource .前端处理程序看起来像这样：

myEventSourceObject.addEventListener('close', () => { myEventSourceObject.close(); myEventSourceObject = null; });
使用 javascript 页面可见性 api 检查旧选项卡是否再次可见，如果是，则将该选项卡重新连接到 sse。

document.addEventListener('visibilitychange', () => { if (!document.hidden && myEventSourceObject === null) { // reconnect your eventsource here } });
如果您按照步骤 2 所述设置服务器代码，则在重新连接时，服务器端代码将删除与 sse 的所有其他连接。因此，您可以在您的选项卡之间单击，并且每个选项卡的 EventSource 将仅在您查看页面时连接。

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

【讨论】：

请注意，页面可见性 api 使用一些旧浏览器的浏览器前缀。如果您不想手动实现它们，请查看 npm 上的这个小包：npmjs.com/package/visibilityjs
不好的建议。您无法停止连接，因为用户将停止获取实时通知。如果用户再次重新连接，则应更新页面以获取新闻。

【解决方案3】：

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

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

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

【讨论】：