Question

基本上问题在于标题。

很多人都有关于如何创建数据URI及其中的问题的堆栈流的问题。

我的问题是为什么要使用数据URI？

做什么有什么好处：

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUA
AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO
9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Red dot" />

过度做：

<img src="dot.png" alt="Red dot" />

我理解服务器端的开销较小（可能），但使用数据URI 的真正优缺点是什么？

Answer 1

根据Wikipedia：

优点：

嵌入数据不需要HTTP请求和标头流量，因此每当编码开销时，数据URI消耗的带宽就会减少作为数据URI的内联内容小于HTTP开销。例如，对于600字节长的图像，所需的base64编码将是800字节，因此如果HTTP请求需要超过200 开销的字节数，数据URI将更有效。
为了传输许多小文件（每个文件少于几千字节），这可能会更快。 TCP传输往往开始缓慢。如果每个文件都需要新的TCP连接，则传输速度受往返时间而非可用带宽的限制。使用HTTP keep-alive可以改善这种情况，但可能无法完全缓解瓶颈。
在浏览安全的HTTPS网站时，Web浏览器通常要求通过安全连接下载网页的所有元素，或者由于安全和不安全元素的混合，将通知用户安全性降低。在配置错误的服务器上，HTTPS请求比普通HTTP请求具有显着的开销，因此在这种情况下将数据嵌入数据URI可能会提高速度。
Web浏览器通常配置为仅生成一定数量（通常是两个）与域的并发HTTP连接，因此内联数据释放了其他内容的下载连接。
对外部资源的访问权限有限或受限的环境可能会在不允许或不实用的情况下嵌入内容在外面。例如，高级HTML编辑字段可以接受粘贴或插入的图像并将其转换为数据URI 隐藏用户的外部资源的复杂性。或者，浏览器可以转换（编码）基于图像的数据剪贴板到数据URI并将其粘贴到HTML编辑字段中。 Mozilla Firefox 4支持此功能。
可以将多媒体页面作为单个文件进行管理。电子邮件消息模板可以包含图像（用于背景或签名）没有图像看起来像是“附件”。

缺点：

数据URI不会从其包含的文档中单独缓存（例如CSS或HTML文件）因此每次下载数据包含文件已重载。内容必须重新编码每次进行更改时都会重新嵌入。
Internet Explorer到版本7（截至2011年1月约占市场份额的15％），缺乏支持。但是，这可以通过提供浏览器特定内容来克服。 Internet Explorer 8将数据URI限制为最大长度为32 KB。
数据作为简单流包含在内，许多处理环境（如Web浏览器）可能不支持使用容器（例如multipart / alternative或message / rfc822）来提供更高的复杂性，例如元数据，数据压缩或内容谈判。
Base64编码的数据URI的大小比其二进制大1/3 当量。（但是，如果HTTP，这个开销减少到2-3％服务器使用gzip压缩响应。数据URI使其更多安全软件很难过滤内容。

根据other sources - 移动浏览器上的数据网址明显变慢。

Answer 2

充分利用数据URI允许下载已在客户端生成的内容，而无需借助服务器端的代理服务器。以下是我能想到的一些例子：

将画布元素的输出保存为图像。
提供以CSV格式下载表格
下载任何在线编辑器的输出（文字，图画，CSS代码等）

Answer 3

主要是我发现如果我不能（出于某种原因）使用CSS sprites并且我不想下载我将用于造型的每一个小图像。

或由于某种原因，您不希望任何人从外部页面链接图像。这可以通过其他方法实现，但嵌入也可以。

否则，我个人不会将大图像编码为照片。最好将媒体放在不同的服务器上。服务器可能缺少安装的所有与Web服务器相关的软件。只需提供媒体。更好地利用资源。

Answer 4

我在几个（C ++，Python）命令行应用程序中使用了数据URI方案来生成报告，其中包含数据图。

拥有单个文件非常方便通过电子邮件发送报告（或一般移动它们）。与PDF相比，我不需要额外的库（除了base64编码常规）我不需要处理分页符（我几乎不需要打印这些报道）。我通常不会将这些报告放在Web服务器上，只需查看它们即可带浏览器的本地文件系统。

Answer 5

我同意BiAiB数据URI的真正价值在于将客户端生成的内容作为文件下载提供，而无需服务器往返。

使用数据URI“提供以CSV格式下载表格”的工作示例is described on my blog。

恕我直言，出于性能原因将图像（或其他二进制资源）数据嵌入到HTML文件中是一个问题。由于HTTP连接较少而导致的速度增加可以忽略不计，并打破了（文本）标记和二进制资源（图像文件，视频等）之间分离的良好原则。

我认为HTTP 1.1流水线和some suggested improvements to HTTP是处理HTTP网络速度问题的更简洁，更好的方法。

为什么要使用数据URI方案？

5 个答案: