将网页的工作本地副本下载为单个 html 文件
Download a working local copy of a webpage as a single html file
我遵循了此 previous post 中提供的说明。我可以下载网页的工作本地副本(例如 wget -p -k https://shapeshed.com/unix-wget/
),但我想将所有文件(js、css 和图像,例如使用 base64 编码)集成到一个 html 文件(或其他方便的格式)。这可能吗?
当然可以。但是你必须手动做一些简单的事情,因为没有可用的工具来自动执行一些步骤。
- 使用具有所有依赖项的 Wget 下载网页。
- 将链接样式表和脚本的内容复制到主 HTML 文件。
- Convert images to Base64 data URIs 包含在 HTML 和 CSS 中,然后将它们插入主 HTML 文件。
- Minify the edited HTML file.
- Convert HTML file to Base64 data URI.
下面是一个编码为 Base64 数据 URI 的单页应用程序示例,用于演示概念(将以下代码复制并粘贴到 Web 浏览器地址栏):
data:text/html;charset=utf-8;base64,PCFkb2N0eXBlIGh0bWw+DQo8aHRtbCBsYW5nPSJlbiI+DQoJPG1ldGEgY2hhcnNldD0idXRmLTgiPg0KCTx0aXRsZT5TaW5nbGUtcGFnZSBBcHBsaWNhdGlvbiBFeGFtcGxlPC90aXRsZT4NCgk8c3R5bGU+DQoJCS8qIENvZGUgZnJvbSBDU1MgZmlsZXMgZ29lcyBoZXJlLiAqLw0KCQlib2R5IHsNCgkJCWZvbnQtZmFtaWx5OiBzYW5zLXNlcmlmOw0KCQl9DQoJCWJ1dHRvbiB7DQoJCQlkaXNwbGF5OiBibG9jaw0KCQl9DQoJPC9zdHlsZT4NCgk8c2NyaXB0Pg0KCQkvLyBDb2RlIGZyb20gLmpzIGZpbGVzIGdvZXMgaGVyZS4gDQoJCWZ1bmN0aW9uIGNoYW5nZVBhcmFncmFwaCgpIHsNCgkJICAgIGRvY3VtZW50LmdldEVsZW1lbnRzQnlUYWdOYW1lKCJwIilbMF0uaW5uZXJIVE1MID0gIkNvbnRlbnQgb2YgcGFyYWdyYXBoIGNoYW5nZWQuIjsNCgkJfQ0KCTwvc2NyaXB0Pg0KCTxib2R5Pg0KCQk8aW1nIHNyYz0iZGF0YTppbWFnZS9wbmc7YmFzZTY0LGlWQk9SdzBLR2dvQUFBQU5TVWhFVWdBQUFVQUFBQUR3QkFNQUFBQ0RBNkJZQUFBQU1GQk1WRVZVVmx1T2o1TC8vLzlrWm1xbXA2bUJnb1dhbTUyeHNyTnpkSGk4dkw3dDdlNzI5dmJHeDhqazVPVFEwZExhMnR2SHNtSDhBQUFDSjBsRVFWUjRBZXpCZ1FBQUFBQ0FvUDJwRjZrQ0FBQUFBQUFBQUFBQUFBQUFBQUFBWUExdElLU2twRERxUUdMQXFBTkhIY2dzSWd3a3d4SUJ6SllCaEJSaEdJYmZiWGZiMWUzcU5vRUU5NVN1bTJuM1Z1SndNSHNRa0FGUVpBVUF4bDA2UU9zRXVNaENDTWNRQVRFWEJhaURBOGdFSUpJQXNKYUFNdmsrVGdrQTVuL2cvN3p2NE9HYitZMmN4djdqVkVaMzRLZG5kNStrTlFudXd1b2NNbDJCOTVZZUZoRHZTVHFmRTAwdldhV3RBcUtrTnNHcndFWUw0S1BrSjNFcW5WanNndTBTWURTdVM5Qk1lQUN3WnFGenJBN0dyZ2x1NHl6cUVuUnlnSkdVdzlzU050ekt5YlNFelNXczF5VzR1WjhEcDY4QXRlR1dXaEJaTVp6TWdhd0J3M0d6SkI3WEpQaFoyN0N1aGd0VzFVSXFRVXY0WXFwa1BiZ21IVUJTazJDaUh0ejA3Y294T1JVdzlTbTdBQXVwRHkvcXVtYlVzY20xcEdkSHZ3RUVTRlpuNTNCZ0VZTGdJUTVOd0o4aHV4MlNZTHZBUVlFS1hvVG81YVQ4ZjhXZkJrWWFnT0FCTEh4U0RvbFVRcllDMytUVUwrZ3JWYk1BZlljM1Z2ZzFjeXoxcWlvTFEvQ0RuZ042QlBGcGVYWlJ6NXB6U0FJUVhBRytBcWlQVVVCbXhYQUprUUlRN0dEa1o5OXp2UFBQejhKYUNJSTZBYTc3ZEI5NDdlOWt0d1NJVjRNUWJPV01VcDkwci9veGRrRjFjb2oyRkFiZHdWaC9zUlZiZUhreVUyQThyYXBVV3NKVVliSUQ3MllQSVZhZzlNRzVvVUJwbGppSlFtVUw0NmZDNWM1UjlldFBlM0FnQUFBQWdBQm83UEZYR0tCcUFBQUFBQUFBQUFBQUFBQUFBQUFBQUxnTmtYVy9TUloxSldBQUFBQUFTVVZPUks1Q1lJST0iIGFsdD0iIj4NCgkJPGgxPlNpbmdsZS1wYWdlIEFwcGxpY2F0aW9uIEV4YW1wbGU8L2gxPg0KCQk8cD5UaGlzIGlzIGFuIGV4YW1wbGUgb2YgYSB3ZWIgYXBwIHRoYXQgaW50ZWdyYXRlcyBIVE1MLCBDU1MsIEphdmFTY3JpcHQsIGFuZCBhbiBpbWFnZSBpbnRvIG9uZSAuaHRtbCBmaWxlIHRoYXQgaXMgZW5jb2RlZCB0byBCYXNlNjQuPC9wPg0KCQk8YnV0dG9uIHR5cGU9ImJ1dHRvbiIgb25jbGljaz0iY2hhbmdlUGFyYWdyYXBoKCkiPkNoYW5nZSBQYXJhZ3JhcGg8L2J1dHRvbj4NCgk8L2JvZHk+DQo8L2h0bWw+
尝试使用 HTTrack
非常高效且易于使用的网站复制器。您所要做的就是粘贴您要制作本地副本的网站的 link
按照您想要的所有内容都在一个页面中执行这些步骤
- 缩小所有样式表并将它们放在
<style>
中
HTML 页面使用 CSS minifier
- 压缩所有脚本并将它们放在同一个文件的
<script>
中。使用 JavaScript Minifier
- 要处理图像,请使用 spites
另一种解决方案是使用带有自定义扩展名的 Web 代理来存储源,请参见。 https://github.com/SommerEngineering/WebProxy
这个 GitHub 项目是我用 Go 编写的一个简单的 Web 代理。 Main.go
第 71 行及之后的行会将原始站点中的任何数据复制到您的浏览器。
在您的情况下,您将添加一个查询是否已存储数据。如果是这样,从磁盘加载并将其发送到您的浏览器。如果没有,则从源加载并存入磁盘。
您使用单文件存储的条件不会成为问题:Go 可以读写,例如ZIP 文件,参见https://golang.org/pkg/archive/zip/。如果您立即需要这些网站转储,则需要一些代码来跟踪所有链接以便立即存储任何内容。
因此,此答案不是您问题的现成解决方案。相反,它需要编写一些代码。 Go 代码可以编译到任何平台(x86、ARM、PPC)和操作系统(Linux、macOS、Windows)。
希望这个答案能给你一个选择。
有一个 Chrome 扩展 SingleFile 可以做到这一点
我遵循了此 previous post 中提供的说明。我可以下载网页的工作本地副本(例如 wget -p -k https://shapeshed.com/unix-wget/
),但我想将所有文件(js、css 和图像,例如使用 base64 编码)集成到一个 html 文件(或其他方便的格式)。这可能吗?
当然可以。但是你必须手动做一些简单的事情,因为没有可用的工具来自动执行一些步骤。
- 使用具有所有依赖项的 Wget 下载网页。
- 将链接样式表和脚本的内容复制到主 HTML 文件。
- Convert images to Base64 data URIs 包含在 HTML 和 CSS 中,然后将它们插入主 HTML 文件。
- Minify the edited HTML file.
- Convert HTML file to Base64 data URI.
下面是一个编码为 Base64 数据 URI 的单页应用程序示例,用于演示概念(将以下代码复制并粘贴到 Web 浏览器地址栏):
data:text/html;charset=utf-8;base64,PCFkb2N0eXBlIGh0bWw+DQo8aHRtbCBsYW5nPSJlbiI+DQoJPG1ldGEgY2hhcnNldD0idXRmLTgiPg0KCTx0aXRsZT5TaW5nbGUtcGFnZSBBcHBsaWNhdGlvbiBFeGFtcGxlPC90aXRsZT4NCgk8c3R5bGU+DQoJCS8qIENvZGUgZnJvbSBDU1MgZmlsZXMgZ29lcyBoZXJlLiAqLw0KCQlib2R5IHsNCgkJCWZvbnQtZmFtaWx5OiBzYW5zLXNlcmlmOw0KCQl9DQoJCWJ1dHRvbiB7DQoJCQlkaXNwbGF5OiBibG9jaw0KCQl9DQoJPC9zdHlsZT4NCgk8c2NyaXB0Pg0KCQkvLyBDb2RlIGZyb20gLmpzIGZpbGVzIGdvZXMgaGVyZS4gDQoJCWZ1bmN0aW9uIGNoYW5nZVBhcmFncmFwaCgpIHsNCgkJICAgIGRvY3VtZW50LmdldEVsZW1lbnRzQnlUYWdOYW1lKCJwIilbMF0uaW5uZXJIVE1MID0gIkNvbnRlbnQgb2YgcGFyYWdyYXBoIGNoYW5nZWQuIjsNCgkJfQ0KCTwvc2NyaXB0Pg0KCTxib2R5Pg0KCQk8aW1nIHNyYz0iZGF0YTppbWFnZS9wbmc7YmFzZTY0LGlWQk9SdzBLR2dvQUFBQU5TVWhFVWdBQUFVQUFBQUR3QkFNQUFBQ0RBNkJZQUFBQU1GQk1WRVZVVmx1T2o1TC8vLzlrWm1xbXA2bUJnb1dhbTUyeHNyTnpkSGk4dkw3dDdlNzI5dmJHeDhqazVPVFEwZExhMnR2SHNtSDhBQUFDSjBsRVFWUjRBZXpCZ1FBQUFBQ0FvUDJwRjZrQ0FBQUFBQUFBQUFBQUFBQUFBQUFBWUExdElLU2twRERxUUdMQXFBTkhIY2dzSWd3a3d4SUJ6SllCaEJSaEdJYmZiWGZiMWUzcU5vRUU5NVN1bTJuM1Z1SndNSHNRa0FGUVpBVUF4bDA2UU9zRXVNaENDTWNRQVRFWEJhaURBOGdFSUpJQXNKYUFNdmsrVGdrQTVuL2cvN3p2NE9HYitZMmN4djdqVkVaMzRLZG5kNStrTlFudXd1b2NNbDJCOTVZZUZoRHZTVHFmRTAwdldhV3RBcUtrTnNHcndFWUw0S1BrSjNFcW5WanNndTBTWURTdVM5Qk1lQUN3WnFGenJBN0dyZ2x1NHl6cUVuUnlnSkdVdzlzU050ekt5YlNFelNXczF5VzR1WjhEcDY4QXRlR1dXaEJaTVp6TWdhd0J3M0d6SkI3WEpQaFoyN0N1aGd0VzFVSXFRVXY0WXFwa1BiZ21IVUJTazJDaUh0ejA3Y294T1JVdzlTbTdBQXVwRHkvcXVtYlVzY20xcEdkSHZ3RUVTRlpuNTNCZ0VZTGdJUTVOd0o4aHV4MlNZTHZBUVlFS1hvVG81YVQ4ZjhXZkJrWWFnT0FCTEh4U0RvbFVRcllDMytUVUwrZ3JWYk1BZlljM1Z2ZzFjeXoxcWlvTFEvQ0RuZ042QlBGcGVYWlJ6NXB6U0FJUVhBRytBcWlQVVVCbXhYQUprUUlRN0dEa1o5OXp2UFBQejhKYUNJSTZBYTc3ZEI5NDdlOWt0d1NJVjRNUWJPV01VcDkwci9veGRrRjFjb2oyRkFiZHdWaC9zUlZiZUhreVUyQThyYXBVV3NKVVliSUQ3MllQSVZhZzlNRzVvVUJwbGppSlFtVUw0NmZDNWM1UjlldFBlM0FnQUFBQWdBQm83UEZYR0tCcUFBQUFBQUFBQUFBQUFBQUFBQUFBQUxnTmtYVy9TUloxSldBQUFBQUFTVVZPUks1Q1lJST0iIGFsdD0iIj4NCgkJPGgxPlNpbmdsZS1wYWdlIEFwcGxpY2F0aW9uIEV4YW1wbGU8L2gxPg0KCQk8cD5UaGlzIGlzIGFuIGV4YW1wbGUgb2YgYSB3ZWIgYXBwIHRoYXQgaW50ZWdyYXRlcyBIVE1MLCBDU1MsIEphdmFTY3JpcHQsIGFuZCBhbiBpbWFnZSBpbnRvIG9uZSAuaHRtbCBmaWxlIHRoYXQgaXMgZW5jb2RlZCB0byBCYXNlNjQuPC9wPg0KCQk8YnV0dG9uIHR5cGU9ImJ1dHRvbiIgb25jbGljaz0iY2hhbmdlUGFyYWdyYXBoKCkiPkNoYW5nZSBQYXJhZ3JhcGg8L2J1dHRvbj4NCgk8L2JvZHk+DQo8L2h0bWw+
尝试使用 HTTrack
非常高效且易于使用的网站复制器。您所要做的就是粘贴您要制作本地副本的网站的 link
按照您想要的所有内容都在一个页面中执行这些步骤
- 缩小所有样式表并将它们放在
<style>
中 HTML 页面使用 CSS minifier - 压缩所有脚本并将它们放在同一个文件的
<script>
中。使用 JavaScript Minifier - 要处理图像,请使用 spites
另一种解决方案是使用带有自定义扩展名的 Web 代理来存储源,请参见。 https://github.com/SommerEngineering/WebProxy
这个 GitHub 项目是我用 Go 编写的一个简单的 Web 代理。 Main.go
第 71 行及之后的行会将原始站点中的任何数据复制到您的浏览器。
在您的情况下,您将添加一个查询是否已存储数据。如果是这样,从磁盘加载并将其发送到您的浏览器。如果没有,则从源加载并存入磁盘。
您使用单文件存储的条件不会成为问题:Go 可以读写,例如ZIP 文件,参见https://golang.org/pkg/archive/zip/。如果您立即需要这些网站转储,则需要一些代码来跟踪所有链接以便立即存储任何内容。
因此,此答案不是您问题的现成解决方案。相反,它需要编写一些代码。 Go 代码可以编译到任何平台(x86、ARM、PPC)和操作系统(Linux、macOS、Windows)。
希望这个答案能给你一个选择。
有一个 Chrome 扩展 SingleFile 可以做到这一点