ArrayBuffer转base64编码的字符串

前言

在向后台请求图片数据的时候，后台可能会将数据以文件流的形式返回。直接获取的话会乱码，这个时候我们需要将responseType修改为arraybuffer。

或者

这样我们才能正确的拿到ArrayBuffer数据。那么，拿到之后又如何转成base64呢？（不转的话没办法显示啊）
网上找到两种方法，刚开始使用第一种，但是发现在图片比较大的时候耗时会很久。最后在这里找到了另外一种方法，快了很多。这里记录一下。

方法

1、

function _arrayBufferToBase64( buffer ) {
    var binary = '';
    var bytes = new Uint8Array( buffer );
    var len = bytes.byteLength;
    for (var i = 0; i < len; i++) {
        binary += String.fromCharCode( bytes[ i ] );
    }
    return window.btoa( binary );
}

2、

var blob = new Blob([arrayBuffer])

var reader = new FileReader();
reader.onload = function(event){
   var base64 =   event.target.result
};

reader.readAsDataURL(blob);

注意：

这里直接拿到的base64是不能直接放到img里面显示的。因为它的前半部分是不对的。这里就需要做一下处理，截取逗号的后半部分，然后拼接上图片的data:image/png;base64即可。