以编程方式将网页保存为静态 HTML 文件的最佳方法

Question

以编程方式将网页保存为静态 HTML 文件的最佳方法

9

我所做的研究越多，前景变得越暗淡。

我正在尝试使用Python进行Flat Save或Static Save网页。这意味着将所有样式合并为内联属性，并将所有链接更改为绝对URL。

我已经尝试了几乎所有免费的转换网站、API甚至是Github上的库。但是没有一个令人印象深刻。我找到的最好的Python实现用于平整化样式是https://github.com/davecranwell/inline-styler。我稍微改编了一下以适应Flask，但生成的文件并不是很好。以下是它的外观：

enter image description here

显然，它应该看起来更好。以下是它应该的样子：

https://dzwonsemrish7.cloudfront.net/items/3U302I3Y1H0J1h1Z0t1V/Screen%20Shot%202012-12-19%20at%205.51.44%20PM.png?v=2d0e3d26

似乎处理格式错误的HTML、无法识别的CSS属性、Unicode错误等问题是一个永无止境的斗争。有没有更好的方法建议？我知道可以在本地浏览器中选择文件->保存，但当我尝试批量执行此操作并提取特定的XPath时，这并不可行。

Evernote的网络剪贴板似乎使用了iFrames，但这似乎比我想象的要复杂。但至少在Evernote上，剪贴内容看起来还不错。

- Nick Woodhams

2

也许可以使用 iMacros 或 Selenium 编写宏，从浏览器中直接完成“文件…另存为”的操作。现在先这样做可能比在 Python 中进行研究更简单。 - jdotjdot

1

也许将整个CSS放在文档本身的<style></style>标签之间。如果整个样式表都转换为内联样式，显然所有特异性都会消失，因此它不会起作用。 - user1721135

感谢迄今为止的回复。我真的想在页面上创建一个Xpath片段，并且希望样式得到保留。我能想到的唯一方法是使用内联样式。对此有什么想法吗？ - Nick Woodhams

你尝试过在Node.js中使用jsdom而不是Python吗？你可以使用getComputedStyle并将其应用于HTML标签。 - Mohsen

2个回答

2

听起来内联样式可能会让你望而却步，但如果不是这样的话，我建议你再看一下Evernote Web Clipper。桌面应用程序有一个导出HTML功能，用于网页剪辑。输出有点凌乱，因为有内联样式，但我发现标记是保存页面的可靠表示。

关于内联和外部样式，对于像这样的东西，如果您正在从不同站点上做很多页面，其中类名会有冲突的样式规则，我认为没有办法避免内联。

您提到Web Clipper使用iFrames，但我发现HTML输出并非如此。如果您要在另一个站点上重新发布（合法地假设），那么您可能需要将静态页面嵌入iFrame中，但除此之外，这不应该成为问题。

某些自动化肯定会帮助你直接从浏览器转到HTML输出，也许还可以将保存的图像重新定位到单个存储库，并在HTML中更新src链接。如果您最终要处理这样的事情，我将非常感激自己尝试一下。

- cantera

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Nick Woodhams · Accepted Answer

在暂停一段时间后，我成功地安装了一个Ruby库，它比我使用过的任何其他东西都更好地压缩了CSS。这是这里非常慢的Web界面背后的库：http://premailer.dialect.ca/。

感谢他们在Github上发布源代码，这是最好的，无庸置疑。https://github.com/alexdunae/premailer 它可以压缩样式，创建绝对URL，与URL或字符串配合使用，甚至可以创建纯文本电子邮件模板。对这个库印象非常深刻。

2013年11月更新:

最终，我编写了一个仅在客户端运行的自己的书签工具。它只兼容Webkit和FireFox。它递归遍历每个节点并添加内联样式，然后将压平的HTML发送到clippy.in API以保存到用户的仪表板中。客户端书签工具。