javascript - 您可以访问 Chrome 开发者网络选项卡数据吗？

Question

有没有办法使用 chrome 开发者网络选项卡中生成的数据？数据是如何产生的？

我正在研究 Puppeteer。我想遍历页面上的所有图像并返回这些图像的图像大小。

我已尝试使用 Resource Timing API，但 transferSize、encodedBodySize 或 decodedBodySize 没有返回我正在寻找的值。

我想访问这个:

https://i.imgur.com/g7blgmj.png

这可能吗？

Answer 1

如果您按照以下步骤操作，可以合理地实现这一点。这可能不是完美的解决方案。但是，您可以获得所需的详细信息。

1. 打开您的开发工具。转到“网络”选项卡。
2. 删除不想下载的列。 (您可以通过右键单击并单击勾号来执行此操作。当您取消勾选时，该列将从控制台中删除)- 请参见下面的第一个屏幕截图。
3. 选择所有项目(按 Ctrl + A)。
4. 右键单击“复制”(或仅按 Ctrl + C)- 请参见下面的第二个屏幕截图。
5. 将其粘贴到 Notepad++ 中查看。

希望对你有帮助