众所周知，外部资源，比如图片，可以使用base64编码嵌入到html文件中：
<img src="data:image/png;base64,iVBORw0KGgoAAAANS..." />
我正在寻找一种纯粹的基于浏览器的 javascript方法来遍历 html 页面并将所有外部资源嵌入到文件中，所以当我说它时$("html").html()，它会返回所有页面的内容。甚至包括其外部资源。
如此有意义，我正在尝试使用服务器上的无头浏览器将网页下载到单个文件中。
问问题
6484 次
2 回答
11
有工具可以做到这一点。例子：
- https://github.com/remy/inliner
- https://github.com/jgallen23/grunt-inline-css
- https://github.com/ceee/grunt-datauri
虽然这种方法有好处，但请记住，多次访问的页面或具有多个具有相同 JS/CSS 文件的页面的站点将享受客户端（浏览器）端缓存。
于 2014-10-27T19:42:09.350 回答
0
使用 Firefox和Chrome的Save Page WE 扩展获得了一些〜变量的成功：
- 火狐：https ://addons.mozilla.org/en-US/firefox/addon/save-page-we/
- 铬：https ://chrome.google.com/webstore/detail/save-page-we/dhhpefjklgkmgeafimnjhojgjamoafof/related
此扩展甚至可以滚动或缩小页面，以便在保存之前获取延迟加载资源。
还尝试了扩展，但那些并没有做我需要的，而有了这个，我设法创建了一个独立的 HTML 文件，其中所有的 CSS/JS/图像作为数据 URL 嵌入。
于 2022-03-01T14:31:28.630 回答