Question

在我的Angular2应用程序中，我想显示一个Uint8Array格式的图像。但我得到'超出最大呼叫堆栈'。我可以渲染大小~48Kb的图像，没有错误。但是当图像大小超过~300Kb时，我才会收到此错误。这就是我渲染图像的方式：

(<HTMLInputElement>document.getElementById("imagePreview")).src = "data:image/" + type + ";base64," +
                        btoa(String.fromCharCode.apply(null, objData.Body));

有人可以告诉我，我是否以正确的方式这样做。如果没有，请告诉我如何正确地做到这一点

Answer 1

String.fromCharcode()会遇到包含大字符串数据的maximum call stack exceeded。

为了能够将所述对象转换为base64，您需要根据字符串长度实现循环。想到这样的事情：

let img: HTMLInputElement = (<HTMLInputElement>document.getElementById("imagePreview"));
let bin : string = '';

for (let i = 0, l = objData.Body.length; i < l; i++) {
    bin += String.fromCharCode(objData.Body[i]);
}

img.src = "data:image/" + type + ";base64," + btoa(bin);

将字符串分成大于1个字符的字符串可能更有效率，但这取决于您找到最快速的方式：）

Angular2 - 渲染图像时的最大调用堆栈超出错误

1 个答案: