base64与二进制之间的转换

2019-02-22 本文已影响0人辉色星空下

在一般情况下我们进行图片转换为base64：

function getBase64Image(img) {

var canvas = document.createElement("canvas");

canvas.width = img.width;

canvas.height = img.height;

var ctx = canvas.getContext("2d");

ctx.drawImage(img, 0, 0, img.width, img.height);

var ext = img.src.substring(img.src.lastIndexOf(".") + 1).toLowerCase();

var dataURL = canvas.toDataURL("image/" + ext);

return dataURL;

}

这样是没有问题的，但是当我们将base64转为二进制或者Blob的时候我们通常会用这个函数：

function dataURLtoBlob(dataurl) {

var arr = dataurl.split(','),

mime = arr[0].match(/:(.*?);/)[1],

bstr = atob(arr[1]),

n = bstr.length,

u8arr = new Uint8Array(n);

while (n--) {

u8arr[n] = bstr.charCodeAt(n);

}

return new Blob([u8arr], {

type: mime

});

}

一般情况下是没有问题的，但是有时候确实会报出错：

Failed to execute 'atob' on 'Window': The string to be decoded is not correctly encoded.

这时有人会在“bstr = atob(arr[1]),”这里加上“decodeURIComponent”,但是也没有用处，这时请看看你的base64的最后面有没有“]”或“ " ”

因为这些都不会被转译，所以要加上这一行：

var _arr = arr[1].substring(0,arr[1].length-2);

我是因为在最后面多了一个引号和中括号，所以是减2，每个人会视情况儿定。

最终的代码是：

dataURLtoBlob(dataurl) {

var arr = dataurl.split(',');

//注意base64的最后面中括号和引号是不转译的

var _arr = arr[1].substring(0,arr[1].length-2);

var mime = arr[0].match(/:(.*?);/)[1],

bstr =atob(_arr),