访问请求的页面大小 - Chrome 扩展答案

【问题标题】：Accessing page size for requests - Chrome Extension访问请求的页面大小 - Chrome 扩展
【发布时间】：2013-04-24 18:06:25
【问题描述】：

我想将给定页面的大小写入控制台。请注意，如果页面被压缩，我想知道压缩后的大小和未压缩的大小。我也希望能够为任何 ajax 请求执行此操作。

如果有办法在没有插件的情况下做到这一点，那就太好了。

【问题讨论】：

试试chrome.devtools.network。
我看过这个，但我不确定我是否可以访问 HAR 数据，除非他们在网络选项卡上打开了 devtools？至少我是这么理解的——“chrome.devtools.* API 模块仅适用于开发者工具窗口中加载的页面。” stackoverflow.com/questions/12689239/…。 HAR 数据正是我想要的，但我需要能够在没有打开的 devtools 的情况下做到这一点。我只想在用户页面上显示页面大小。
您需要创建一个devtools 扩展。在您的问题中，您说必须将信息记录到控制台，因此要求打开开发工具应该不是问题。
chrome.webRequest（与下面的答案相同的限制，但没有额外的请求）或 chrome.debugger（不确定）API 可能有用。
使用当前的 API 似乎是不可能的。

标签： javascript debugging google-chrome google-chrome-extension

【解决方案1】：

var req = new XMLHttpRequest();
req.open('GET', document.location, false);
req.send(null);
var headers = req.getAllResponseHeaders().toLowerCase();
var encoding = (headers.match(/Content-encoding\: (\w*)/i) || []).pop();
var unpacked_size = req.responseText.length;
var packed_size = -1;
if (['gzip','deflate','lzh','sdch'].indexOf(encoding) !== -1) {
    packed_size = parseInt((headers.match(/content-length\: (\d*)/i) || []).pop());
}

var result = {
    encoding: encoding,
    unpacked_size: unpacked_size,
    packed_size: packed_size,
}

【讨论】：

这是通过 ajax 请求完成的，我不想让这个额外的请求。
无法从页面自己的javascript范围内访问当前页面的标题数据。而且您的问题没有说明这是一项要求。
问题标题是“Accessing page size for requests - Chrome Extension”。它需要是一个 chrome 扩展 afaik。
content-length 经常被跳过，在某些情况下不应该添加。