一个更好的测试base64 URI支持(我可以在JS中创建一个大的base64编码的图像吗?)

A better test for base64 URI support (can I create a large base64-encoded image in JS?)

本文关键字:base64 一个 编码 创建 图像 支持 测试 更好 URI 我可以 JS      更新时间:2023-09-26

我正在使用Modernizr来检测用户正在运行的浏览器中支持的功能,到目前为止一切顺利。但是在测试base64兼容性时,我遇到了一个理论问题。此支持的补丁详细说明在这里,并且工作-除了IE8的奇怪情况-它只允许base64编码的图像最多32KB。

我真的不想在我的JS文件中嵌入一个32KB长的base64字符串,它会增加一个疯狂的膨胀量。那么,我可以使用JS创建一个32KB的有效图像吗?我在考虑在字符串中重复某种模式,直到长度达到32KB,诸如此类的事情。或者取一个现有的小字符串(如Modernizr补丁中的字符串),并在末尾添加垃圾数据,仍然会产生有效的图像。

我对base64编码几乎一无所知,除了如何操作现有的图像。有人有什么想法吗?

我想我有答案了。我尝试了各种各样的技术(我可以手动添加的PNG源中的重复文本块等),直到我发现添加换行符似乎可以完成工作:

    var b64test = new Image();
    b64test.onload = function() {
       alert("yay!")
    }
    b64test.onerror = function() {
       alert("boo")
    }
    /* A 1x1 GIF image */
    var base64str = "R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw=="
    while (base64str.length < 33000) {
        base64str = "'r'n" + base64str;
    }
    b64test.src= "data:image/gif;base64," + base64str;

在IE8中失败,在IE9和其他版本中正常。我很想听听其他的选择

相关文章: