浏览器如何知道加载进度？答案

【问题标题】：how does browser know loading progress?浏览器如何知道加载进度？
【发布时间】：2014-09-14 04:50:18
【问题描述】：

当您在浏览器中加载页面时，它会显示加载页面时加载的百分比。与使用 XMLHttpRequest (XHR) 执行 AJAX 请求时相同，它允许您查看加载百分比。

我只是好奇这些功能是如何在幕后实现的。客户端如何事先知道它将接收到的数据大小？就个人而言，当我使用 Node.js 创建我的 Web 服务器时，我并没有手动实现这样的功能，比如向客户端发送每毫秒间隔加载的百分比等。

这一切是如何运作的？

【问题讨论】：

我绝不是这方面的专家，但我认为加载的百分比只是已渲染网站的百分比。当浏览器从服务器检索数据时，它知道确切的大小，然后在每个元素被渲染后更新剩余的数据。但我不确定。
可能通过阅读 Content-Length entity-header？

标签： javascript ajax node.js browser xmlhttprequest

【解决方案1】：

当浏览器向服务器请求资源时，在大多数情况下，服务器会在下载开始之前回复所请求资源的大小。 For Example:

HTTP/1.1 200 OK
Date: Mon, 23 May 2005 22:38:34 GMT
Server: Apache/1.3.3.7 (Unix) (Red-Hat/Linux)
Last-Modified: Wed, 08 Jan 2003 23:11:55 GMT
ETag: "3f80f-1b6-3e1cb03b"
Content-Type: text/html; charset=UTF-8
Content-Length: 131
Accept-Ranges: bytes
Connection: close

<html>
<head>
  <title>An Example Page</title>
</head>
<body>
  Hello World, this is a very simple HTML document.
</body>
</html>

在上面的服务器响应中，给出了请求资源的长度，因此客户端会知道要读取多少字节。这允许客户端显示有意义的进度指示器。

【讨论】：

欢迎来到 Stack Overflow！不错的答案。我只是想让您知道我提交的编辑将在链接旁边的答案本身中包含示例。您做得很好，但在没有说明链接内容概要的情况下发布链接并不是一个好习惯，因为如果链接的网站发生更改或链接中断，您的回答可能会变得毫无用处。