加载数据时浏览器忙指示器

2023-11-24

我正在努力实现已经解释过的目标here.

我正在尝试使用动态脚本标签将一些数据从服务器加载到客户端。 (即我创建一个脚本标签,将其 src 设置为我的 JSON 控制器并将其附加到我的 head 或 body 标签)。

脚本正确加载从服务器返回的数据。但在脚本加载期间, 浏览器不显示繁忙指示器(尝试使用 Chrome/Firefox)(同时根据这个参考(第 35 页),这应该是默认行为)。

我还添加了Sleep方法以我的服务器端方法来模拟一个长时间运行的进程,看到繁忙指示器出现。但仍然没有运气。

附注当我使用IFrame代替script,一切正常,浏览器显示忙碌指示器。但无法使用脚本标签来做到这一点。


简而言之:

facebook 在加载页面数据时确实使用了 iframe,并且浏览器加载指示器没有什么神奇之处。


更多细节:

当您从一个页面导航到另一个页面时,FB 会向 DOM 中注入一个隐藏的 Iframe,并且其 src 属性将设置为您请求的页面(有几个参数表明这是一个类似 ajax 的请求,而不是整个页面刷新)。所以页面实际上是在隐藏的 iframe 中加载的。然而,内容不是 HTML,而是一堆 javascript 标签,这些标签消耗一些包含 HTML 和呈现页面所需的其他数据的 JSON 对象。
下面是当 iframe 注入到 DOM 时加载页面期间我的 firebug 控制台。您可以检查页面加载完成后,iframe 是否被删除。

facebook hidden iframe

要了解这些脚本如何加载页面数据,您可以阅读有关大管道技术。简而言之,它将每个页面的结构分解为几个所谓的页面pagelets,它们有自己的一组 CSS 和 JS 资源,因此每个 pagelet 的资源可以与其他 pagelet 并行地从服务器获取。big_pipe在所有资源可用后,将设法将每个 pagelet 放入其容器中。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

加载数据时浏览器忙指示器 的相关文章

  • 如何将udp发送到udp node.js服务器?

    我对此很陌生 所以我真的不知道我在做什么 但我已经设置了一个 node js udp 服务器 我想从客户端 来自网站 向它发送一个数据包 但我不知道如何在 javascript 中做到这一点 或者是否可能 我不是在研究如何从 Node js
  • Angular 2 链式 Promise 并传递拒绝

    应该是一个简单的问题 但是我找不到有关如何做到这一点的文档 像这样链接一个承诺 Making a promise no problem let promise new Promise resolve reject gt let data d
  • VBA / HTML / jQuery 选择自动完成 - 在列表中选择

    我正在尝试使用 Excel 中的 VBA 在网站的列表中选择一个值 这不是一个 正常列表 该网站使用 jQuery 选择自动完成 如下所示 example http davidwalsh name demo jquery chosen ph
  • 非 DOM 对象上的 jQuery 自定义事件

    我最近阅读了一些代码 其功能如下 bob name Bob Smith rank 7 bob bind nameChanged function bob trigger nameChanged 这似乎有效 但我在 jQuery 文档或源代码
  • 如何按照编写的顺序迭代 javascript 对象属性

    我发现了代码中的一个错误 我希望通过最少的重构工作来解决该错误 此错误发生在 Chrome 和 Opera 浏览器中 问题 var obj 23 AA 12 BB iterating through obj s properties for
  • Leaflet js虚构地图

    我是 Leaflet 的新手 我想了解如何创建完全交互式的虚构地图 我有一张图像想要转换为传单地图 该图像基本上像图表一样具有许多连接和点 我想首先将该图像转换为地图 能够将鼠标悬停在这些点上 突出显示它们并显示有关它们的信息 并且还可以在
  • 使用 CryptoJS 更改密钥 [重复]

    这个问题在这里已经有答案了 我正在使用 CryptoJS 来加密和解密文本 在这里 我只是获取消息并显示加密和解密消息 我使用DES算法进行加密和解密 这是我的 HTML 文件
  • 仅一页 JavaScript 应用程序

    您是否尝试过单页 Web 应用程序 即浏览器仅从服务器 获取 一页 其余部分由客户端 JavaScript 代码处理 此类 应用程序页面 的一个很好的例子是 Gmail 对于更简单的应用程序 例如博客和 CMS 使用这种方法有哪些优点和缺点
  • 在闪亮的数据表中为每个单元格显示工具提示或弹出窗口?

    有没有什么方法可以为 r闪亮数据表中的每个单元格获取工具提示 有很多方法可以获取悬停行或列 但我找不到一种方法来获取行和列索引并为每个单元格显示不同的悬停工具提示 任何人都可以修改以下代码吗 library shiny library DT
  • 如果链接包含特定文本,jQuery 将类添加到 href

    我的网站上的列表中有一些动态填充的链接 这些链接链接到文件 是否可以使用 jQuery 查看文件名是否以 pdf 结尾 并在 href 或类似的链接文本以 mp3 结尾时添加一个类 例如 我的列表中有以下链接 文件1 pdf 歌曲1 mp3
  • 未捕获的错误:找不到模块“jquery”

    我在用Electron https github com atom electron制作桌面应用程序 在我的应用程序中 我正在加载一个外部站点 Atom 应用程序之外 可以说http mydummysite index html http
  • 是否有任何非轮询方式来检测 DOM 元素的大小或位置何时发生变化?

    很长一段时间以来 我一直在寻找一种方法来检测 DOM 元素的大小或位置何时发生变化 这可能是因为窗口调整了大小 或者因为向该元素添加了新的子元素 或者因为在该元素周围添加了新元素 或者因为 CSS 规则已更改 或者因为用户更改了浏览器的字体
  • 在d3.js中将2D形状转换为3D,并根据ANGULAR中的值调整高度

    我正在使用 d3 js v6 创建以下 2D 图表表示的 3D 图表 这个圆圈中有多个正方形 每个正方形都根据值分配了一种颜色 值越大 正方形越暗 现在我想将其转换为 3D 形状 其中当值变高时 只有特定正方形的高度会增加 因此结果在某种程
  • 淡出和循环一组 div 的最佳方式

    假设我有以下 div div class a You are funny div div class b You are smart div div class c You are cool div 最好的展示方式是什么div a持续 5
  • 为什么“tbody”不设置表格的背景颜色?

    我在用 tbody 作为 CSS 选择器来设置background color在一个表中 我这样做是因为我有多个 tbody 表内的部分 它们具有不同的背景颜色 我的问题是 当使用border radius在细胞上 细胞不尊重backgro
  • JavaScript 代码在不使用 ActiveX 的情况下截取网站屏幕截图

    我有一个用户与之交互的 JavaScript 应用程序 我需要保存当前界面的外观 裁剪出我需要的部分 或者通过指定div只拍摄我需要的部分 然后发送回服务器 显然任何外部服务都无法做到这一点 我需要一个 JavaScript 或Flash
  • 如果数字小于 10,则显示前导零 [重复]

    这个问题在这里已经有答案了 可能的重复 JavaScript 相当于 printf string format https stackoverflow com questions 610406 javascript equivalent t
  • 在 Javascript 中减少/分组数组

    基于this https stackoverflow com a 40774906 3254598例如 我想以稍微不同的方式按对象进行分组 结果应该如下 key audi items make audi model r8 year 2012
  • 如何在打字稿文件中导入没有定义文件的js库

    随着我们的项目变得越来越大 我想从 JavaScript 切换到 TypeScript 以帮助进行代码管理 然而 我们使用许多库作为 amd 模块 我们不想将其转换为 TypeScript 我们仍然想将它们导入 TypeScript 文件
  • 用于 C# XNA 的 Javascript(或类似)游戏脚本

    最近我准备用 XNA C 开发另一个游戏 上次我在 XNA C 中开发游戏时 遇到了必须向游戏中添加地图和可自定义数据的问题 每次我想添加新内容或更改游戏角色的某些值或其他内容时 我都必须重建整个游戏或其他内容 这可能需要相当长的时间 有没

随机推荐

  • 如何从 Azure Blob 存储查看图像而不是下载图像?

    好的 我正在使用 Node js 和 Azure Blob 存储来处理一些文件上传 当一个人上传图像时 我想向他们显示图像的缩略图 上传效果很好 我将其存储在我的 blob 中 我使用了这个很好的链接 使用 Azure SDK for No
  • 未经许可的地理定位[重复]

    这个问题在这里已经有答案了 我注意到现代基于 html5 的地理定位总是询问用户 您想与此网站共享您的位置吗 这很好 但我知道还有其他途径可以尝试确定大致的地理位置 而无需请求此许可 如果我记得的话 这些服务使用 IP 数据库来尝试跟踪地理
  • 我可以将 socket.io 事件侦听器分离到不同的模块中吗?

    我正在处理超过 15 个不同的套接字事件 我想在与这些事件相关的模块中管理某些 socket io 事件 例如 我想让一个名为 login js 的文件处理login套接字事件 名为 register js 的文件处理注册套接字事件 索引
  • 根据 Django 管理中的父模型预填充内联

    我有两个模型 Event and Series 其中每个事件都属于一个系列 大多数时候 一个事件start time与其系列相同default time 这是模型的精简版本 models py class Series models Mod
  • 有哪些好的 WCF/Web 服务安全读物? [关闭]

    Closed 此问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 目前不接受答案 最近 我做了很多与 WCF Web 服务和分布式计算相关的学习和工作 但大多数安全概念都超出了我的理解范围 传输安全 消息安全 加密 证书等 我了解
  • Arraylists 的 Arraylist 的通用类型

    在正常的数组列表初始化中 我们过去定义泛型类型如下 List
  • 使用 Laravel 从 Web 服务器流式传输 Amazon S3 对象

    在我使用 laravel 5 1 构建的 Web 应用程序中 用户可以上传我存储在 Amazon S3 中的一些敏感文件 后来我想要用户经许可下载此文件 由于我希望进行此身份验证检查 因此我无法使用传统方法通过直接链接到 S3 中的文件来下
  • jQuery 从文本区域转义 HTML

    我想将 HTML 标签转义为实体名称 从textarea并将结果放入第二个textarea这样
  • 如何设置 selenium 3.0,在 c# 中出现错误“The geckodriver.exe 文件不存在...”

    将 Visual Studio 中的 selenium 更新为 3 0 将 Firefox 更新为 47 0 现在当我尝试使用本地 Webdriver 模式时收到此错误 当前目录或 PATH 环境变量上的目录中不存在 geckodriver
  • 使用同一 Visual Studio 2005 解决方案的不同版本/分支

    这是使用 VS2005 的可用性问题 我有从版本控制中签出的同一个 Visual Studio 2005 解决方案的不同分支 解决方案和项目文件也受到版本控制 在我的开发工作站上 有时我会在不同版本或分支上打开多个 Visual Studi
  • 打破嵌套循环和主循环[重复]

    这个问题在这里已经有答案了 我有以下代码 int x 100 Or some other value while x gt 0 for int i 5 i gt 0 i x x 2 if x 0 break 然而 这只会破坏 for 循环
  • Windows 的 Curses 替代方案 [关闭]

    Closed 此问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 目前不接受答案 python 有没有可以在 Windows 中使用curses 模块的替代方案 我查了一下 python 文档 但其中提到它可以在 unix 中使用
  • ExecutorService 的 shutdown() 不会等到所有线程都完成

    我有一个代码 其中 4 个线程同时运行 我想等到这 4 个线程全部完成 只有在那之后才能继续应用程序流程 我尝试了两种方法 Thread join 此方法按预期工作 后面的代码join 仅在所有线程完成后才执行 ExecutorServic
  • Laravel htaccess 问题

    我正在尝试建立一个网站 该网站在实时开发服务器上运行得非常好 我们一直用该服务器向客户端展示该网站 这是来自实时开发的 htaccess 工作正常
  • 覆盖 Android 上的物理菜单按钮

    我希望 Android 设备上的菜单键打开一个对话框 而不是在我的应用程序运行时打开菜单 我尝试将其编码为onCreateOptionsMenu Menu menu 但它只在我第一次按下菜单按钮时起作用 我可以用其他方式来做吗 您可以通过在
  • 如何使用 Ncurses 打印 (☞゚ヮ゚)☞?

    我想在 Ubuntu 中使用 C 使用 Ncurses 库打印 首先 您只需拥有以下内容即可做到这一点 std cout lt lt lt lt std endl 而且效果很好 但是 当使用 Ncurses 打印时 我认为您需要使用prin
  • 停止 Jetpack Compose pointInteropFilter 消耗输入事件

    我有一个垂直的Column有两个孩子 A Pager可组合 来自伴奏者 显示Text A Canvas绘制两个圆弧和一个圆的可组合项 它们的排序顺序与此处描述的顺序相同 我想要Text始终渲染在Canvas 实施细节 The Canvas可
  • 不同CG/GLSL/HLSL功能的性能

    有着色器函数的标准库 例如 forCg 但是是否有资源可以告诉您每个操作需要多长时间 我的想法类似于您过去如何查找每个 ASM 操作需要多少个周期 没有reliable资源将告诉您各种标准着色器函数需要多长时间 即使对于特定的硬件也是如此
  • 捆绑包无效 - Info.plist 中的 CFBundleVersion 和 CFBundleShortVersionString 必须包含更高版本 - 但它们确实包含

    在尝试验证我的应用程序以准备提交到应用程序商店时 我收到以下错误 但这是我的 Info plist 的屏幕截图 错误消息声称列表版本为 1 0 但显示版本为 1 4 我做错了什么 我该如何解决这个问题 Apple 考虑每个版本级别 sepa
  • 加载数据时浏览器忙指示器

    我正在努力实现已经解释过的目标here 我正在尝试使用动态脚本标签将一些数据从服务器加载到客户端 即我创建一个脚本标签 将其 src 设置为我的 JSON 控制器并将其附加到我的 head 或 body 标签 脚本正确加载从服务器返回的数据