使用 atob() 方法时出现无效字符错误答案

【问题标题】：Invalid character error while using atob() method使用 atob() 方法时出现无效字符错误
【发布时间】：2019-06-21 19:14:23
【问题描述】：

我已阅读堆栈溢出问题，此代码在 IE 10 中有效，但在 ie9 中无效，

但我仍然面临这个问题。

var image = canvas.toDataURL();
image = image.replace(/^data:[a-z]*;,/, '');
var byteString = atob(image);
var buffer = new ArrayBuffer(byteString.length);
var intArray = new Uint8Array(buffer);
for (var i = 0; i < byteString.length; i++) {
    intArray[i] = byteString.charCodeAt(i);
}
blob = new Blob([buffer], {type: "image/png"});
window.navigator.msSaveOrOpenBlob(blob, "test.png");

在转换 atob(image) 时会抛出异常 0x800a139e - JavaScript 运行时错误：InvalidCharacterError 我尝试了几件事，但没有任何效果......

我在图像变量中得到了这个

data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAcIAAAGQCAYAAAA9XmC5AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAABJFSURBVHhe7dvPa5x3fsDxeaR0l3UO9dLuSnJLE3rpzc6pp0KUQ2MLL8Xk1BZWt+7BhmKaGYctfKR3ng8vjyZTE6W5St98PZnF9ZO/NeZsiyWt0+c//RUWQBHxIkQjlBGsEx7Eb/7ZbqQF23zz22vvf+L6+f/Um4BQDeNRqPtvMoy194TQsc5EcIRatv2SZnmY9L1HOOUuDPdADpJCOEIRfQex7BaviCzkXsRxwc5At3kyzJwxMoXZmZfdLnZ7/c3yxwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAvkF6vf8DAs32KwowBEUAAAAASUVORK5CYII= 请帮我.. 提前谢谢..

【问题讨论】：

标签： javascript internet-explorer-10

【解决方案1】：

1) 您的 base64 编码字符串可能不完全有效。您可以尝试使用此代码而不是atob

var decodeBase64 = function(s) {
    var e={},i,b=0,c,x,l=0,a,r='',w=String.fromCharCode,L=s.length;
    var A="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
    for(i=0;i<64;i++){e[A.charAt(i)]=i;}
    for(x=0;x<L;x++){
        c=e[s.charAt(x)];b=(b<<6)+c;l+=6;
        while(l>=8){((a=(b>>>(l-=8))&0xff)||(x<(L-2)))&&(r+=w(a));}
    }
    return r;
};

2) 我觉得应该是image = image.replace(/^[^,]+,/, '');

3) 据我所知，IE 中对Blob 的支持从版本 10 开始 - https://developer.mozilla.org/en-US/docs/Web/API/Blob

【讨论】：

在那个字符串中，我只是删除了它，它对我有用..data:image/png;base64，非常感谢你..这太好了..是的，我知道 blob 是IE 9 及以下版本不支持。对于 IE 9 及以下版本，我们还有其他选择吗？
@Srinivasan 这就是image = image.replace(/^[^,]+,/, ''); 正在做的事情

【解决方案2】：

如果有人遇到此问题并且 image = image.replace(/^[^,]+,/, ''); 解决方案对他们不起作用，我在 IE11 中调用 atob 函数时遇到相同的错误。

在我的例子中，错误是因为 base64 字符串每 76 个字符有一个回车。

这对于 Chrome 或 Firefox 来说不是问题，但 IE11 生成了InvalidCharacterError。

b64Data = b64Data.replace(/\r\n/g, ''); 解决了我的问题。

【讨论】：