html - HTML - 数据协议URL大小限制

142 2

“data:”URL scheme值是否有大小限制?换一句话说 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)

时间: 原作者:

117 4

关于Web浏览器的限制,MSIE 6/7不支持dataURL scheme,更多信息在维基百科

每个浏览器的长度限制不同,我知道IE8和Opera允许最多32KB,但是我不知道其他浏览器是多少。

原作者:
115 1

我刚刚快速检查了八个不同的jpeg图像,它大小从3,844到2,233 076字节。

以下浏览器都在我的Windows 7(64位)系统上正确显示了每个图像:

  • Chromium 14.0.816.0
  • Firefox 11.0
  • Google Chrome 18.0.102 5.142
  • Internet Explorer 9,0.564位
  • Opera 11.62
  • Safari 5.1.5

原作者:
109 2

使用函数进行blob处理:dataURLtoBlob


function dataURLtoBlob(dataurl) {


 var arr = dataurl.split(\',\'), mime = arr[0].match(/:(.*?);/)[1],


 bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);


 while(n--){


 u8arr[n] = bstr.charCodeAt(n);


 }


 return new Blob([u8arr], {type:mime});


}



然后创建blob url


var temp_url = window.URL.createObjectURL(blob);



如果需要,在新窗口中使用它。


var redirectWindow = window.open(\'\');


redirectWindow.document.write(\'<iframe src=\"\' + temp_url + \'\" frameborder=\"0\" style=\"border:0; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%;\" allowfullscreen></iframe>\') 



适用于chrome/firefox 2017中的大文件

原作者:
89 3

根据维基百科页面,IE7缺乏支持,IE8将它限制为32kB数据。

原作者:
57 4

下面是我在浏览器中创建大文件下载的解决方案。 (我将它用于JSON数据)


function exportToFile(jsonData, fileName) {


 const u8arr = new TextEncoder(\'utf-8\').encode(JSON.stringify(jsonData, null, 2));


 const url = window.URL.createObjectURL(new Blob([u8arr], { type: \'application/json\' }));


 const element = document.createElement(\'a\');


 element.setAttribute(\'href\', url);


 element.setAttribute(\'download\', fileName);


 element.style.display = \'none\';


 document.body.appendChild(element);


 element.click();


 document.body.removeChild(element);


}



原作者:
145 2

注意:在IE中还有一些附加限制。 对于iframe限制为4KB

MSDN

原作者:
...