加载数据时,浏览器占用指示灯指示灯、加载、浏览器、数据

2023-09-10 17:19:07 作者:你别皱眉

我要实现的目标已经解释这里。

I'm trying to achieve what has been explained here.

我想从服务器加载一些数据来使用动态脚本标记客户端。 (即我创建一个脚本标记,设置它的SRC到我的JSON控制器,并将它添加到我的头部或身体标记)。

I am trying to load some data from server to the client side using dynamic script tags. (i.e I create a script tag, set its src to my JSON controller and append it to my head or body tag).

脚本加载正确的数据从服务器返回。但是,在脚本加载, 浏览器不显示繁忙指示器(试图与铬/火狐)(根据this参考(第35页),这应该是默认的行为)。

the script loads correctly with the data returned from server. But during the script load, the browser doesn't display busy indicator (tried with Chrome/Firefox) (while according to this reference (page 35), this should be the default behavior).

此外,我已经添加了睡眠方法到我的服务器端的方法来模拟一个长时间运行的过程中,看到忙碌的指示出现。但仍然没有运气。

Also I have added Sleep method to my server side method to simulate a long-running process, to see the busy indicator appears. But still no luck.

P.S。当我使用的IFrame 而不是剧本,一切工作正常和繁忙的指标是浏览器中显示。但couln't与脚本标记做到这一点。

P.s. When I use IFrame instead of script, everything works fine and the busy indicator is displayed by browser. but couln't do it with script tag.

推荐答案

DO的Facebook页面加载数据时使用内置页框的,并没有什么神奇的有关浏览器加载指示器。

In short:

facebook DO make use of iframes when loading page data, and there is nothing magical about browser loading indicator.

当你从一个网页到另一个导航,FB注入一个隐藏的iframe中的DOM和它的src属性将被设置为你问过的页面(​​与一对夫妇的参数,表示这是一个Ajax样的要求,而不是整页刷新)。因此,网页实际上得到了隐藏的iframe装载。但内容不是HTML,而是它的一帮其服用含HTML和渲染页面所需的其他数据的一些JSON对象的JavaScript标签。 下面是我的萤火控制台加载一个页面时的iframe注入到DOM中。您可以检查页面加载完成后,iframe中被删除。

when you navigate from one page to another, FB injects a hidden Iframe into DOM and its src attribute will be set to the page you've asked (with a couple of parameters indicating this is an ajax-like request and not a full page refresh). So the page actually gets loaded in the hidden iframe. However the content is not HTML, and instead it's a bunch of javascript tags which consume some JSON objects containing HTML and other data that is required to render the page. Below is from my firebug console during loading a page when the iframe is injected to DOM. you can check that after page finishes loading, the iframe is removed.

要获取这些脚本是如何工作的加载页面数据从某种意义上说,你可以阅读关于 BigPipe技术 。简单地说,它打破了建筑的每一页成几个所谓的的小页的,它有自己的一套CSS和JS的资源,所以每个小页的资源可以获取从并行到其他小页服务器。 big_pipe 将设法把每一个小网页到它的容器后,其所有的资源可用。

To get a sense of how these scripts work to load the page data, you can read about the BigPipe Technique. In a nutshell, it broke down construction of each page into a couple of so called pagelets, which have their own set of CSS and JS resources, so the resources of each pagelet can be fetch from server parallel to other pagelets. big_pipe will manage to put every pagelet into it's container after all its resources become available.