ArrayBuffer到base64编码的字符串

2020/10/15 08:01 · javascript ·  · 0评论

我需要一种有效的(读取本机)方式将转换ArrayBuffer为需要在多篇文章中使用的base64字符串。

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

这对我来说很好:

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

在ES6中,语法稍微简单一些:

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

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

对于那些喜欢它的人来说,这是另一种Array.reduce不会引起堆栈溢出的用法:

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

还有另一种异步方式使用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"
var blob = new Blob([arrayBuffer])

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

reader.readAsDataURL(blob);

我用这个为我工作。

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

我的建议是不要使用本机btoa策略,因为它们不能正确编码所有ArrayBuffer的……

重写atob()和btoa()的DOM

由于DOMString是16位编码的字符串,因此在大多数浏览器中,如果字符超出8位ASCII编码字符的范围,则在Unicode字符串上调用window.btoa会导致“字符超出范围”异常。

尽管我从未遇到过这个确切的错误,但我发现ArrayBuffer我尝试编码的许多编码都不正确。

我会使用MDN建议或要点。

以下是2个简单的函数,用于将Uint8Array转换为Base64 String并再次返回

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

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

我参加晚会很晚,但是这是本地人,时间很短。

 const blob = new Blob( [ your-fancy-buffer ], { type: "image/jpeg" } );
 const urlCreator = window.URL || window.webkitURL;
 base64string = urlCreator.createObjectURL(blob) 

您可以ArrayBuffer使用从派生普通数组Array.prototype.slice使用类似Array.prototype.map将字节转换为字符并将join它们一起转换为格式字符串的函数

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

}

此方法速度更快,因为其中没有任何字符串连接在运行。

OP没有指定运行环境,但是如果您使用的是Node.JS,则有一种非常简单的方法来执行此操作。

使用官方的Node.JS文档进行Accordig
https://nodejs.org/api/buffer.html#buffer_buffers_and_character_encodings

// This step is only necessary if you don't already have a Buffer Object
const buffer = Buffer.from(yourArrayBuffer);

const base64String = buffer.toString('base64');

另外,例如,如果您在Angular下运行,则在浏览器环境中也可以使用Buffer Class。

在我身边,使用Chrome导航器,我不得不使用DataView()来读取arrayBuffer

function _arrayBufferToBase64( tabU8A ) {
var binary = '';
let lecteur_de_donnees = new DataView(tabU8A);
var len = lecteur_de_donnees.byteLength;
var chaine = '';
var pos1;
for (var i = 0; i < len; i++) {
    binary += String.fromCharCode( lecteur_de_donnees.getUint8( i ) );
}
chaine = window.btoa( binary )
return chaine;}
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从字符串解压缩归档文件,则更好

本文地址:http://javascript.askforanswer.com/arraybufferdaobase64bianmadezifuchuan.html
文章标签: ,   ,   ,  
版权声明:本文为原创文章,版权归 javascript 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!