ArrayBuffer以base64编码的字符串

Question

我需要一种高效的（本地读取）方法来将ArrayBuffer转换为需要在多部分帖子上使用的base64字符串。

Answer 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); 
} 

但是，非本机实现方式更快，例如， https://gist.github.com/958841 看到http://jsperf.com/encoding-xhr-image-data/6

Answer 2

这对我工作得很好：

var base64String = btoa(String.fromCharCode.apply(null, new Uint8Array(arrayBuffer))); 

在ES6，语法是有点简单：

let base64String = btoa(String.fromCharCode(...new Uint8Array(arrayBuffer))); 

正如在评论中指出，这种方法可能会导致当ArrayBuffer较大时，在某些浏览器中出现运行时错误。在任何情况下，确切的大小限制都取决于实现。

Answer 3

function _arrayBufferToBase64(uarr) { 
    var strings = [], chunksize = 0xffff; 
    var len = uarr.length; 

    for (var i = 0; i * chunksize < len; i++){ 
     strings.push(String.fromCharCode.apply(null, uarr.subarray(i * chunksize, (i + 1) * chunksize))); 
    } 

    return strings.join(""); 
} 

这是更好的，如果你使用JSZip用于解压缩归档从字符串

Answer 4

我提出这一建议是不要使用本地btoa策略，因为它们不正确编码所有ArrayBuffer的...

rewrite the DOMs atob() and btoa()

由于DOMStrings是16位编码的字符串，在大多数浏览器上一个Unicode字符串调用window.btoa会引起CHARAC如果字符超出8位ASCII编码字符的范围，则超出范围异常。

虽然我从来没有遇到过这种确切的错误，我发现许多我试图编码的ArrayBuffer的已编码不正确。

我会使用MDN建议或要点。

• https://github.com/beatgammit/base64-js
• https://gist.github.com/jonleighton/958841

Answer 5

还有另一种异步方式使用Blob和的FileReader。

我没有测试性能。但这是一种不同的思考方式。

function arrayBufferToBase64(buffer, callback) { 
    var blob = new Blob([buffer],{type:'application/octet-binary'}); 
    var reader = new FileReader(); 
    reader.onload = function(evt){ 
     var dataurl = evt.target.result; 
     callback(dataurl.substr(dataurl.indexOf(',')+1)); 
    }; 
    reader.readAsDataURL(blob); 
} 

//example: 
var buf = new Uint8Array([11,22,33]); 
arrayBufferToBase64(buf, console.log.bind(console)); //"CxYh" 

Answer 6

我用这个，并为我工作。

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); 
} 



function base64ToArrayBuffer(base64) { 
    var binary_string = window.atob(base64); 
    var len = binary_string.length; 
    var bytes = new Uint8Array(len); 
    for (var i = 0; i < len; i++)  { 
     bytes[i] = binary_string.charCodeAt(i); 
    } 
    return bytes.buffer; 
} 

Answer 7

可以通过使用Array.prototype.slice导出从ArrayBuffer正常阵列。 使用像Array.prototype.map这样的函数将字节转换为字符并将它们一起转换为形成字符串。

function arrayBufferToBase64(ab){ 

    var dView = new Uint8Array(ab); //Get a byte view   

    var arr = Array.prototype.slice.call(dView); //Create a normal array   

    var arr1 = arr.map(function(item){   
     return String.fromCharCode(item); //Convert 
    }); 

    return window.btoa(arr1.join('')); //Form a string 

} 

由于没有字符串连接在其中运行，因此此方法更快。

Answer 8

对于那些谁喜欢总之，这里是一个另一种使用Array.reduce这不会导致堆栈溢出：

var base64 = btoa(
    new Uint8Array(arrayBuffer) 
    .reduce((data, byte) => data + String.fromCharCode(byte), '') 
); 

Answer 9

下面是两个简单的功能Uint8Array转换为Base64编码字符串，然后再返回

arrayToBase64String(a) { 
    return btoa(String.fromCharCode(...a)); 
} 

base64StringToArray(s) { 
    let asciiString = atob(s); 
    return new Uint8Array([...asciiString].map(char => char.charCodeAt(0))); 
}