javascript - 使 Socket.IO 显示浏览器的页面加载指示器(纺车)

Question

我正在用 Node.js 构建一个 Web 应用程序，并使用 Socket.IO 处理客户端和服务器端之间的数据传输。

我的 Web 应用程序的核心部分是内容提要。我的客户端 Javascript 为新闻源的内容发出 Socket.IO 调用。一旦响应从服务器返回，它就会使用 JQuery 填充网页上的提要。

我的问题是 Socket.IO 不会导致浏览器的页面加载指示器(对于 Chrome，这是网页选项卡中的旋转轮)显示。我想让它显示。没有这个加载指示器，我的网页看起来好像加载完成了，但实际上还没有加载(提要还没有填充)。

这个问题的正确解决方案是什么？提前致谢!

Answer 1

本身没有正确的答案:浏览器 vendor 对于为什么某些事件会和不会显示“正在加载”状态有不同的理由:A good rundown here .

一般来说，类似 ajax 的请求(与实际整页加载异步的事物)可能不应该默认显示加载指示器，因为忙碌状态向用户表明浏览器很慢/很忙，我们使用 ajax 请求进行各种处理后台任务。当然，有时开发人员会想要显示这些指示器(表单提交、通过 ajax 下载后续页面的单页应用程序):有时我们想向用户传达一些重要的事情正在发生并且他们应该等待它完成)但是我们没有太多的控制来强制它在异步请求中发生。在某些浏览器上“伪造”它的唯一真正方法是在 iframe 中加载内容:在这种情况下，某些现代浏览器确实会触发“忙碌”状态。

对于 Websockets，大多数 vendor 可能相当合理地应用了与 ajax 请求相同的逻辑:有许多您希望使用 websockets 执行的操作可以在没有用户实际直接启动它们的情况下发生，因此他们应该不会触发那种“浏览器严重繁忙，稍等”的感觉。而且，与 ajax 一样，遗憾的是，我所知道的 api 无法取消该设计决策。

iframe 解决方案是有限的:它适用于某些浏览器，但不是所有浏览器(值得注意的是，它在所有主要移动浏览器中都被忽略)。并且粗暴地做它(即创建一个隐藏的 iframe，当你想要它触发负载指示器并在你想要取消它们时删除它)有成本:你基本上需要点击一个旨在“停滞”的资源(比如只运行 sleep(10000) 的 php 页面，因此保持连接打开)。这既很重要(额外的 http 请求只是为了触发效果)，也会占用一些服务器以保持打开的连接，而这些连接基本上什么都不做。这可能无法扩展，特别是如果该服务器与托管您的应用程序的服务器相同。

您可能反而坚持编写自定义加载指示器(微调器，固定在屏幕顶部的假进度条)。它并不令人满意，但它是唯一可以保证向用户传达您想要的内容的方法。我有一个针对 jQuery ajax 的解决方案，它利用了 iframe 方法 ( Noisy JSON )，您可以将其复制为 socket.io 的插件，但如果您使用的是 websockets，那基本上意味着回退到 ajax 风格的请求通信.而且您在 Safari、移动和更新的 IE 上仍然不走运。