读取包含 Base64-Embedded 格式的所有图像的网页答案

【问题标题】：Read a web page with all images in Base64-Embedded format读取包含 Base64-Embedded 格式的所有图像的网页
【发布时间】：2011-11-30 20:15:20
【问题描述】：

在我的场景中，我想以编程方式下载页面（Internet 上的任何页面）的 HTML，但我还希望 HTML 中的所有图像都采用 base64 嵌入格式（未引用)

换句话说，而不是：

<img src='/images/delete.gif' />

我希望下载的 html 看起来像这样：

<img src="data:image/gif;base64,R0lGODl..." />

这样我就不需要经历将所有图像存储在目录等中的过程。

你们中有人知道如何做到这一点吗？或者任何插件可以有效地做到这一点？

【问题讨论】：

base-64 字符串中的图像尺寸较大，使 HTML 源代码不可读。为什么要将所有外部源转换为 base-64 字符串？
这不是一个真正的问题！！
我对大小没问题，因为无论如何，所有这些大小都会在多个请求中从网络请求。

标签： c# html web

【解决方案1】：

嗯，你需要：

下载原始 HTML
在 HTML 中查找每个 img 元素（例如使用 HTML agility pack）并针对每个元素：
- 如果它已经在使用数据 URL，请忽略它
- 否则：
- 下载图片
- 使用Convert.ToBase64String将其编码为Base64
- 将原始img 标记替换为使用base64 版本的标记（在原始字符串中，或通过DOM 表示）
将最终的 HTML 保存到磁盘

这些步骤中的任何一个是否会导致您遇到特定问题？您可以通过并行下载图像来加快速度，但我会先获得串行版本。

【讨论】：

我很好奇有没有什么神奇的方法可以做到这一点，因为我很关心优化。但是当你这么说的时候，我应该去 :) - 谢谢
@valipour：这是一个非常不寻常的要求，所以如果有现成的工具可以做到这一点，我会感到惊讶。但是，是的，去吧。还要考虑您要优化的什么，并为自己设定性能目标，以便知道何时可以停止。

【解决方案2】：

您可以考虑使用MHTML 格式，而不是在 src 属性中使用带有图像作为 base64 编码字符串的 html 页面。大多数浏览器都支持该格式，并且它嵌入了所有外部资源（包括图像）。

var msg = new CDO.MessageClass();
msg.MimeFormatted = true;
msg.CreateMHTMLBody("http://www.google.com", CDO.CdoMHTMLFlags.cdoSuppressNone, "", "");
var stream = msg.GetStream();
var mhtml = stream.ReadText(stream.Size);

【讨论】：

至少在 Chrome 中，Save As... mhtml 实际上并没有将图像嵌入为 base64 数据源。我不敢相信没有一个简单的应用程序可以做到这一点。应用程序，程序，实用程序，等等。我什至会在这一点上使用 NPM 包。因为我们有一个不错的“网页”，所以我们需要以简报的形式发送出去。

【解决方案3】：

使用正则表达式 (regex) 从 img 标签中提取 URL，使用 Uri 类将它们转换为绝对 URL，然后使用 WebClient 下载目标图像。之后就是使用 Convert.ToBase64String 生成 Base64 的一个例子。

【讨论】：