IE canvas转图片下载时 -传递给系统调用的数据区太小-

问题：

canvas转换成图片下载的时候IE浏览器会报‘传递给系统调用的数据区太小’错误，原因是canvas.toDataURL()方法转换出的url的长度超过了IE浏览器的限制

解决方法：

使用canvas.msToBlob()方法将canvas转换成Blob，然后使用navigator.msSaveBlob()下载,完整兼容代码如下：

function downloadURI(canvas, name) {
    if (navigator.msSaveBlob) { // IE10+ 
        let blob = canvas.msToBlob(); 
        return navigator.msSaveBlob(blob, name); 
    } else { 
        let uri = canvas.toDataURL("image/png");
        let link = document.createElement("a"); 
        link.download = name; 
        link.href = uri; 
        document.body.appendChild(link); 
        if (link.click) { 
            link.click(); 
        } else { 
            let event = document.createEvent('MouseEvents'); 
            event.initMouseEvent('click', true, true, window); 
            link.dispatchEvent(event); 
        } 
        document.body.removeChild(link); 
    } 
}
复制代码

原帖来源stackoverrun

转载于:https://juejin.im/post/5c4e7597518825637f0d6ae0