Ich muss eine Base64-Codierungszeichenfolge in einen ArrayBuffer konvertieren. Die base64-Zeichenfolgen sind Benutzereingaben. Sie werden aus einer E-Mail kopiert und eingefügt, sodass sie beim Laden der Seite nicht vorhanden sind. Ich möchte dies in Javascript tun, ohne wenn möglich einen Ajax-Aufruf an den Server zu senden.

Ich fand diese Links interessant, aber sie haben mir nicht geholfen:

ArrayBuffer zu Base64-codierter Zeichenfolge

Hierbei handelt es sich um die entgegengesetzte Konvertierung von ArrayBuffer zu base64, nicht umgekehrt

http://jsperf.com/json-vs-base64/2

Das sieht gut aus, aber ich kann nicht herausfinden, wie man den Code benutzt.

Gibt es eine einfache (möglicherweise native) Möglichkeit, die Konvertierung durchzuführen? Vielen Dank

Versuche dies:

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

Verwenden von TypedArray.from :

Uint8Array.from(atob(base64_string), c => c.charCodeAt(0))

Die Leistung muss mit der for-Loop-Version der Goran.it-Antwort verglichen werden.

Die Antwort von Goran.it funktioniert aufgrund eines Unicode-Problems in Javascript nicht - https://developer.mozilla.org/en-US/docs/Web/API/WindowBase64/Base64_encoding_and_decoding .

Am Ende habe ich die Funktion von Daniel Guerreros Blog verwendet: http://blog.danguer.com/2011/10/24/base64-binary-decoding-in-javascript/

Die Funktion ist unter dem Github-Link aufgeführt: https://github.com/danguer/blog-examples/blob/master/js/base64-binary.js

Verwenden Sie diese Zeilen

var uintArray = Base64Binary.decode(base64_string);  
var byteArray = Base64Binary.decodeArrayBuffer(base64_string); 

Ich habe gerade base64-arraybuffer gefunden, ein kleines npm-Paket mit unglaublich hoher Auslastung, 5 Millionen Downloads im letzten Monat (2017-08).

https://www.npmjs.com/package/base64-arraybuffer

Für alle, die nach einer der besten Standardlösungen suchen, ist dies möglicherweise die richtige Lösung.

Asynchrone Lösung, es ist besser, wenn die Daten groß sind:

// base64 to buffer
function base64ToBufferAsync(base64) {
  var dataUrl = "data:application/octet-binary;base64," + base64;

  fetch(dataUrl)
    .then(res => res.arrayBuffer())
    .then(buffer => {
      console.log("base64 to buffer: " + new Uint8Array(buffer));
    })
}

// buffer to base64
function bufferToBase64Async( buffer ) {
    var blob = new Blob([buffer], {type:'application/octet-binary'});    
    console.log("buffer to blob:" + blob)

    var fileReader = new FileReader();
    fileReader.onload = function() {
      var dataUrl = fileReader.result;
      console.log("blob to dataUrl: " + dataUrl);

      var base64 = dataUrl.substr(dataUrl.indexOf(',')+1)      
      console.log("dataUrl to base64: " + base64);
    };
    fileReader.readAsDataURL(blob);
}

Für Node.js Benutzer:

const myBuffer = Buffer.from(someBase64String, 'base64');

myBuffer ist vom Typ Buffer, einer Unterklasse von Uint8Array. Leider ist Uint8Array KEIN ArrayBuffer, wie es das OP verlangt hat. Aber wenn ich einen ArrayBuffer manipuliere, verpacke ich ihn fast immer mit Uint8Array oder ähnlichem, daher sollte er nahe an dem liegen, wonach gefragt wird.

Javascript ist eine gute Entwicklungsumgebung, daher scheint es seltsam, als würde es keine Lösung für dieses kleine Problem bieten. Die an anderer Stelle auf dieser Seite angebotenen Lösungen sind möglicherweise langsam. Hier ist meine Lösung. Es verwendet die integrierte Funktionalität, die Base64-Bild- und Sounddaten-URLs dekodiert.

var req = new XMLHttpRequest;
req.open('GET', "data:application/octet;base64," + base64Data);
req.responseType = 'arraybuffer';
req.onload = function fileLoaded(e)
{
   var byteArray = new Int8Array(e.target.response);
   // var shortArray = new Int16Array(e.target.response);
   // var unsignedShortArray = new Int16Array(e.target.response);
   // etc.
}
req.send();

Die Sendeanforderung schlägt fehl, wenn die Zeichenfolge der Basis 65 schlecht gebildet ist.

Der MIME-Typ (Anwendung / Oktett) ist wahrscheinlich nicht erforderlich.

In Chrom getestet. Sollte in anderen Browsern funktionieren.

Pure JS - kein String-Mittelschritt (kein Atob)

Ich schreibe folgende Funktion, die base64 direkt konvertiert (ohne Konvertierung in einen String im mittleren Schritt). IDEE

• Holen Sie sich 4 Base64 Zeichen Chunk
• Finden Sie den Index jedes Zeichens im base64-Alphabet
• Index in 6-Bit-Zahl konvertieren (Binärzeichenfolge)
• Verbinden Sie vier 6-Bit-Zahlen, die eine 24-Bit-Zahl ergeben (als Binärzeichenfolge gespeichert).
• Teilen Sie die 24-Bit-Zeichenfolge in drei 8-Bit-Zeichenfolgen auf und verdecken Sie jede, um sie zu nummerieren und im Ausgabearray zu speichern
• Eckfall: Wenn die Eingabe Base64-Zeichenfolge mit einem / zwei Zeichen endet =, entfernen Sie eine / zwei Zahlen aus dem Ausgabearray

Die folgende Lösung ermöglicht die Verarbeitung großer Base64-Eingabezeichenfolgen. Eine ähnliche Funktion zum Konvertieren von Bytes in base64 ohne btoa gibt es HIER

function base64ToBytesArr(str) {
  const abc = [..."ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/"]; // base64 alphabet
  let result = [];

  for(let i=0; i<str.length/4; i++) {
    let chunk = [...str.slice(4*i,4*i+4)]
    let bin = chunk.map(x=> abc.indexOf(x).toString(2).padStart(6,0)).join(''); 
    let bytes = bin.match(/.{1,8}/g).map(x=> +('0b'+x));
    result.push(...bytes.slice(0,3 - (str[4*i+2]=="=") - (str[4*i+3]=="=")));
  }
  return result;
}


// --------
// TEST
// --------


let test = "Alice's Adventure in Wonderland.";  

console.log('test string:', test.length, test);
let b64_btoa = btoa(test);
console.log('encoded string:', b64_btoa);

let decodedBytes = base64ToBytesArr(b64_btoa); // decode base64 to array of bytes
console.log('decoded bytes:', JSON.stringify(decodedBytes));
let decodedTest = decodedBytes.map(b => String.fromCharCode(b) ).join``;
console.log('Uint8Array', JSON.stringify(new Uint8Array(decodedBytes)));
console.log('decoded string:', decodedTest.length, decodedTest);

const str = "dGhpcyBpcyBiYXNlNjQgc3RyaW5n"
const encoded = new TextEncoder().encode(str) // is Uint8Array
const buf = encoded.buffer // is ArrayBuffer