Javascript 如何将网页快照及其所有元素(css、js、图像等)保存到一个文件中
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/5627032/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to save a web page snapshot with all its elements (css, js, images, ...) into one file
提问by Vacilando
How is it possible to programmatically save a web page snapshot with all its elements (css, js, images, ...) into one file?
如何以编程方式将网页快照及其所有元素(css、js、图像等)保存到一个文件中?
I need to archive some web pages regularly. However, just saving their HTML code is useless - not only because of images missing but esp. because the absence of CSS on today's pages can turn a web page into unrecognizable mess.
我需要定期存档一些网页。然而,仅仅保存他们的 HTML 代码是没有用的——不仅是因为图像丢失,尤其是因为图像丢失。因为当今页面上缺少 CSS 可能会将网页变成无法识别的混乱。
I remember the .mht format that worked like this, but that required manual saving, and it was just a feature of IE. I believe there is an open-source solution that can achieve this programmatically, but despite hours of searching I cannot find it on the web.
我记得 .mht 格式是这样工作的,但这需要手动保存,这只是 IE 的一个功能。我相信有一个开源解决方案可以以编程方式实现这一点,但是尽管搜索了数小时,我还是无法在网络上找到它。
回答by peteorpeter
I think @reisio (+1) has you covered...
我认为@reisio (+1) 已经涵盖了您...
...But if only to plug a great free tool, I would point out the Firefox extension Save Complete, which does an admirable job of grabbing "complete" pages on an ad hocbasis. The output will be a single HTML file with an accompanying directory stuffed with all the resources - you can easily zip them up for archiving.
...但如果只是为了插入一个很棒的免费工具,我会指出 Firefox 扩展Save Complete,它在临时抓取“完整”页面方面做得非常出色。输出将是一个单独的 HTML 文件,附带一个包含所有资源的目录 - 您可以轻松地将它们压缩以进行存档。
It's not without fault - I've had issues with corrupted .png
files lately on OSX, but I use it frequently for building mockups off of live pages and it's a huge time-saver. (Also of note, it hasn't been updated for FF 4 yet, and is the sole reason I rolled back to 3.6)
这并非没有错——我.png
最近在 OSX 上遇到了文件损坏的问题,但我经常使用它来从实时页面构建模型,这节省了大量时间。(另外请注意,FF 4 还没有更新,这是我回滚到 3.6 的唯一原因)
回答by ProTom
If you are using Google Chrome just use the save page as menu entry (CTRL + s), and select complete website from the options at the bottom of the file dialog. This save the HTML and all required resources (in a separate folder).
如果您使用的是 Google Chrome,只需将保存页面用作菜单项 (CTRL + s),然后从文件对话框底部的选项中选择完整的网站。这将保存 HTML 和所有必需的资源(在单独的文件夹中)。
回答by John R.
Apple's Safari has a pretty good solution. It saves all HTML and CSS (sadly no JS) but in a format called webarchive. It's one file, but it requires Safari to save and open, and Safari requires a Mac. Even though Safari for Windows does exist, it's too old to work with webpages, and it doesn't even support saving as webarchive, or opening them. If you have a Mac, open any website in Safari and press ?S and then make sure that Web Archive appears in the drop down.
Apple 的 Safari 有一个很好的解决方案。它保存了所有 HTML 和 CSS(遗憾的是没有 JS),但采用一种称为 webarchive 的格式。它是一个文件,但它需要 Safari 来保存和打开,而 Safari 需要一台 Mac。尽管 Safari for Windows确实存在,但它太旧而无法处理网页,它甚至不支持另存为 webarchive 或打开它们。如果您有 Mac,请在 Safari 中打开任何网站并按 ?S,然后确保 Web Archive 出现在下拉列表中。
There is also a Chrome extensionthat can open these types of files, but not save them.
还有一个Chrome 扩展程序可以打开这些类型的文件,但不能保存它们。
Apologies for replying to such an old thread, just wanted to spread this info!
抱歉回复这么旧的帖子,只是想传播这个信息!
回答by Zain Khalid
Use wget in terminal
在终端中使用 wget
wget -p -k http://www.example.com/
It'll make a clone of site frontend html, css, js, svg etc. But not in one file as asked.
它将克隆站点前端 html、css、js、svg 等。但不会按照要求在一个文件中。