html - 数据协议(protocol) URL 大小限制

Question

“数据:”URL 方案是否有大小限制值(value)观？我对流行网络浏览器的限制很感兴趣。换句话说，data:image/jpg;base64,base64_encoded_data可以多长时间？在 <img src="data:image/jpg;base64,base64_encoded_data" />或 background-image: url(data:image/jpg;base64,base64_encoded_data) ？

Answer 1

简答:数据 URI 限制各不相同。

有很多答案。正如 5 多年前提出的问题一样，由于过时，现在大多数问题都不正确，但这个问题位于谷歌“数据 uri 限制”结果的顶部。数据 URI 现在是 widely supported并且 IE 7/8 不再是相关的浏览器。下面有很多引用资料，因为今天的答案很微妙。

数据 URI 限制

数据 URI 规范未定义大小限制，但表示应用程序可能会施加自己的限制。

• Chrome - 2MB对于当前文档。否则，限制是任意 blob 的内存存储限制:如果是 x64 而不是 ChromeOS 或 Android，则为 2GB；否则，total_physical_memory/5 ( source )。
• Firefox - unlimited
• IE ≥ 9 & Edge - 4GB
• Safari 和移动 Safari - ?

备选方案

一项技术 higher limit (500MiB in Chrome)可能是您的用例的替代方案是通过 URL.createObjectURL() 的 Blob URLs使用 URL API通过 File API 与 blob 一起. Using URL.createObjectURL() 中提供了一个示例.

How to write a file / give it to the user 中提到的其他一些替代方案是:FileSaver.js , StreamSaver.js , 和 JSZip .

您可以使用 Modernizr 检测对 data URIs over 32kb 的支持.

相关问题

这些答案与这个问题几乎相同，但我提到它们是为了节省您阅读每个答案的时间。

• getting max Data-Uri size in Javascript
• “Aw, Snap” when data uri is too large
• What is the size limit of a Base64 DataURL image?
• What is the maximum length of a URL in different browsers?这个问题是关于 URL，而不是数据 URI，但是有关于数据 URI 的相关答案和评论。
• Is it possible to programmatically detect size limit for data url?