问题描述
“data:” 的 URL 方案值是否有大小限制?我对流行的网络浏览器的限制感兴趣。换句话说,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)
中使用多长时间?
最佳解决方案
关于 Web 浏览器的限制,MSIE 6/7 不支持数据 url 方案… 更多信息 wikipedia
每个浏览器的长度限制是不同的 – 我相信 IE8 允许高达 32KB,歌剧是 4KB,但不能真正地告诉其他浏览器…
次佳解决方案
我刚刚做了一个快速检查嵌入八个不同的 Jpeg-images 范围从 3,844 到 2,233,076 字节的大小。
所有以下浏览器在我的 Windows 7(64 位) 系统上正确显示每个图像:
-
chrome 14.0.816.0
-
Firefox 11.0
-
Google Chrome 18.0.1025.142
-
Internet Explorer 9.0.5(64 位)
-
歌剧 11.62
-
Safari 5.1.5
第三种解决方案
来自 http://www.ietf.org/rfc/rfc2397.txt:
The “data:” URL scheme is only useful for short values. Note that some applications that use URLs may impose a length limit; for example, URLs embedded within
<A>
anchors in HTML have a length limit determined by the SGML declaration for HTML [RFC1866]. The LITLEN (1024) limits the number of characters which can appear in a single attribute value literal, the ATTSPLEN (2100) limits the sum of all lengths of all attribute value specifications which appear in a tag, and the TAGLEN (2100) limits the overall length of a tag.
第四种方案
简短答案:数据 URI 限制有所不同。
有很多答案。由于这个问题是在 5 年前提出的,大部分时间已经过时了,所以这个问题是谷歌搜索结果顶部的 「数据 uri 限制」 。数据 URI 现在是 widely supported,IE 7/8 不再是相关的浏览器。以下有很多参考文献,因为今天的答案是微妙的。
数据 URI 限制
数据 URI 规范没有定义大小限制,但是应用程序可能会强加自己的大小限制。
Alternatives
具有 higher limit (500MiB in Chrome)的一个实验技术可能是您的用例的替代品,是 URL.createObjectURL()通过 URL API 与 BABB 通过 File API 。使用 URL.createObjectURL() 中提供了一个示例。
如何写入文件/给用户提及的其他一些替代方法是:FileSaver.js,StreamSaver.js 和 JSZip 。
您可以使用 Modernizr 检测对 data URIs over 32kb 的支持。
相关问题
这些答案与这个问题大致相同,但我提到他们为你节省阅读时间。
-
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?
第五种方案
我读过 Safari 的数据 URI 限制为 128K:
http://blog.clawpaws.net/post/2007/07/16/Storing-iPhone-apps-locally-with-data-URLs#c1989348
而 Chrome 是 2M:
http://code.google.com/p/chromium/issues/detail?id=44820#c1
第六种方案
真的是 「data URI scheme」 。
根据维基百科页面,IE7 缺少支持,IE8 betas 将其限制为 32kB 的数据。
第七种方案
只是一个 FYI,我能够使用 Firefox 3.5 中的数据网址从 JavaScript ajax 调用加载 130K 的图像。它在 IE 8 中截断了图像,但整个事情出现在 FF 中。
第八种方案
似乎在 Firefox 3.6 的限制是 600KB 。
参考文献
注:本文内容整合自 Google/Baidu/Bing 辅助翻译的英文资料结果。如果您对结果不满意,可以加入我们改善翻译效果:薇晓朵技术论坛。