MSEdge浏览器中canvas.toBlob()的兼容性
MSEdge浏览器中canvas.toBlob()的兼容性
提问于 2019-05-28 14:49:19
我使用canvas.toBlob()回调方法将图像文件转换为blob。但是我发现toBlob和微软的edge浏览器不兼容。
我尝试过检测浏览器，并根据浏览器使用toBlob()。对于Edge，我们有canvas.msToBlob()，对于其他浏览器，我们有canvas.toBlob()。我们有没有什么常用的方法来创建blob呢？
let isEdgeBrowser =
msie\s|trident\/|edge\//i.test(window.navigator.userAgent);
if (isEdgeBrowser) {
let blob = canvas.msToBlob();
}
if (!isEdgeBrowser) {
canvas.toBlob((blob) => {
this.fileUploadedSize = blob.size;
});
}回答 1
Stack Overflow用户
发布于 2019-05-28 15:29:02
根据this article，我们可以看到HTMLCanvasElement.toBlob()方法不支持边缘浏览器，如果您想在边缘浏览器中使用此方法，请尝试添加以下polyfill：
if (!HTMLCanvasElement.prototype.toBlob) {
Object.defineProperty(HTMLCanvasElement.prototype, 'toBlob', {
value: function (callback, type, quality) {
var dataURL = this.toDataURL(type, quality).split(',')[1];
setTimeout(function() {
var binStr = atob( dataURL ),
len = binStr.length,
arr = new Uint8Array(len);
for (var i = 0; i < len; i++ ) {
arr[i] = binStr.charCodeAt(i);
}
callback( new Blob( [arr], {type: type || 'image/png'} ) );
});
}
});
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/56336478
复制相关文章
相似问题
腾讯云开发者
