移动端UC浏览器不支持Blob的解决方案

来源：互联网发布：淘宝图库网址编辑：程序博客网时间：2024/06/18 08:11

前言

uc浏览器不支持Blob的解决方案
参考文章：http://www.haomou.net/2016/01/14/2016_android_blob/
如果你使用canvas导出图片，并将图片存储在uint8Array中，然后想通过blob构造之后上传到诸如aliyun oss服务器，或者个人文件服务器，那么你要注意了。在chrome早先版本和目前的android中，至少是andrid5.1之前的浏览器，包括微信浏览器等，都不支持blob的构造方法，需要使用BlobBuilder。

原因

var jpeg = new Blob( [array.buffer], {type : "image/jpeg"});

这个blob的构造方法，在ios手机浏览器是支持的，但是在android手机浏览器不行。
桌面版的chrome浏览器解决了这个blob bug, 但是android手机还是有这个问题，会返回一个type error，因为android浏览器不支持这个构造方法。你必须使用老版本的BlobBuilder API.

解决方法

var array = new Int8Array([17, -45.3]);try{  var jpeg = new Blob( [array], {type : "image/jpeg"});}catch(e){    // TypeError old chrome and FF    window.BlobBuilder = window.BlobBuilder ||                         window.WebKitBlobBuilder ||                         window.MozBlobBuilder ||                         window.MSBlobBuilder;    if(e.name == 'TypeError' && window.BlobBuilder){        var bb = new BlobBuilder();        bb.append([array.buffer]);        var jpeg = bb.getBlob("image/jpeg");    }    else if(e.name == "InvalidStateError"){        // InvalidStateError (tested on FF13 WinXP)        var jpeg = new Blob( [array.buffer], {type : "image/jpeg"});    }    else{        // We're screwed, blob constructor unsupported entirely    }}

0 0