如何获得完整页面加载的传输大小？答案

【问题标题】：How to get transferred size of a complete page load?如何获得完整页面加载的传输大小？
【发布时间】：2015-02-13 22:16:55
【问题描述】：

使用 Selenium 或 JavaScript，您如何获得已加载页面的（通过网络）传输大小（字节），包括所有内容、图像、css、js等？

首选大小是通过网络传输的大小，即压缩的大小，仅用于发出的请求等。

这是您通常可以在开发工具中看到的，在网络状态栏的右侧：

如果这不可能，是否可以只获得所有加载资源的总大小（没有压缩等）？那将是一个可以接受的替代方案。

浏览器是 Firefox，但如果可以使用其他兼容 Selenium 的浏览器也可以。

我想这可以使用代理来完成，但是有没有 JS 或 Selenium 方法来获取这些信息？

如果代理是唯一的方法，那么将使用（或实施）哪一种方法来简化此类任务？只是在设置驱动程序之前用 Java 实现一些东西？

（该解决方案至少可以在 Linux 上运行，但最好也可以在 Windows 上运行。我正在通过 Java 使用 Selenium WebDriver。）

【问题讨论】：

为什么投反对票？谢谢你的帽子。 ;-)
Selenium 和 JS 都无法访问电线（网络）。他们只能看到渲染引擎 (DOM)。您将需要其他东西来获取该信息。

标签： java javascript firefox selenium selenium-webdriver

【解决方案1】：

是的，您可以使用 BrowserMobProxy 来完成。这是一个使用 selenium 代理跟踪来自客户端的网络流量的 java jar。比如页面加载持续时间，查询字符串到不同的服务等。你可以得到它 bmp.lightbody.net 。此 api 将创建 .har 文件，其中将包含所有这些 json 格式的信息，您可以使用这些信息来阅读一个在线工具http://www.softwareishard.com/har/viewer/

【讨论】：

【解决方案2】：

为了将来参考，可以通过 javascript 从浏览器请求此信息。但是，在撰写本文时，尚无浏览器支持此特定数据的此功能。 More information can be found here.

同时，对于 Chrome，您可以从性能日志中解析此信息。

    //Enable performance logging
    LoggingPreferences logPrefs = new LoggingPreferences();
    logPrefs.enable(LogType.PERFORMANCE, Level.ALL);
    capa.setCapability(CapabilityType.LOGGING_PREFS, logPrefs);

    //Start driver
    WebDriver driver = new ChromeDriver(capa);

然后你可以像这样获取这些数据

for (LogEntry entry : driver.manage().logs().get(LogType.PERFORMANCE)) {
        if(entry.getMessage().contains("Network.dataReceived")) {
            Matcher dataLengthMatcher = Pattern.compile("encodedDataLength\":(.*?),").matcher(entry.getMessage());
            dataLengthMatcher.find();
            //Do whatever you want with the data here.
        }

如果像您的情况一样，您想知道单个页面加载的细节，您可以使用加载前和加载后时间戳，并且只获取该时间范围内的条目。

【讨论】：

【解决方案3】：

我已经在 Python 中实现了这一点，这可能会为人们节省一些时间。设置日志记录：

logging_prefs = {'performance' : 'INFO'}    
caps = DesiredCapabilities.CHROME.copy()
caps['loggingPrefs'] = logging_prefs
driver = webdriver.Chrome(desired_capabilities=caps)

计算总数：

total_bytes = []
for entry in driver.get_log('performance'):
        if "Network.dataReceived" in str(entry):
            r = re.search(r'encodedDataLength\":(.*?),', str(entry))
            total_bytes.append(int(r.group(1)))
            mb = round((float(sum(total_bytes) / 1000) / 1000), 2)

【讨论】：

【解决方案4】：

Hakello 的回答中提到的性能 API 现在得到了很好的支持（除了 IE 和 Safari 之外的所有东西），并且易于使用：

return performance
  .getEntriesByType("resource")
  .map((x) => x.transferSize)
  .reduce((a, b) => (a + b), 0);

您可以使用executeScript 运行该脚本以获取自上次导航事件以来下载的字节数。无需设置或配置。

【讨论】：