如何使用 javascript 获取脚本和样式表的文件大小

Posted 2023-03-07

【中文标题】如何使用 javascript 获取脚本和样式表的文件大小

【英文标题】：How to get file size of scripts and stylesheets with javascript

【发布时间】：2015-05-22 07:21:22

【问题描述】：

我有一个单页应用程序，它加载了一个缩小的 javascript 文件和一个样式表。这样做时，我想显示一个进度条。

是否可以获取文件大小并计算我的进度条的值？或者有其他方法吗？

<link rel="stylesheet" href="myPath/myStyles.css" type="text/css">
<script type="text/javascript" src="myPath/myScript.js"></script>

【问题讨论】：

github.hubspot.com/pace/docs/welcome

你能做一个 ajax 调用吗？将信息报告回您的 javascript 的 php 脚本？

@some-non-descript-user 抱歉，没有 php 可能

@Drops 不错，但是如何在加载其他文件之前执行脚本？

这些资源有多大？似乎几乎没有必要为需要 500-1000 毫秒的事情设置进度条。如果你真的想要一个进度条，你可以放一个假的，总是最多 2 秒之类的。

【参考方案1】：

无法找到与页面一起加载的资源的大小。

您需要从 JavaScript 加载资源，以便访问包含大小的 HTTP 标头。

或者您需要操纵服务器通过其他方法（例如更新 cookie）发送附加信息。

我想可能有第三种方法，您可以将大小作为信息放入文件中，例如具有诸如 my-file-size color:25 之类的 CSS 实体。但是您需要一个相当强大的工作流程来保持同步。

更新：忘记了第四个方法，该方法是在页面加载后从 JavaScript 对相同资源进行另一个请求。您可以只从服务器请求标头，不需要加载整个资源。