Преобразовать строку base64 в ArrayBuffer

Мне нужно преобразовать строку кодировки base64 в ArrayBuffer. Строки base64 являются входными данными пользователя, они будут скопированы и вставлены из электронной почты, поэтому их не будет, когда страница будет загружена. Я хотел бы сделать это в javascript, не делая аякс-вызов на сервере, если это возможно.

Я нашел эти ссылки интересными, но они не помогли мне:

ArrayBuffer для кодированной строки base64

это обратное преобразование, от ArrayBuffer до base64, а не наоборот

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

это выглядит хорошо, но я не могу понять, как использовать код.

Есть ли простой (возможно, родной) способ сделать преобразование? спасибо

Ответ 1

Попробуйте следующее:

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

Ответ 2

Используя TypedArray.from:

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

Производительность сравнивать с циклической версией ответа Goran.it.

Ответ 3

Ответ Goran.it не работает из-за проблемы unicode в javascript - https://developer.mozilla.org/en-US/docs/Web/API/WindowBase64/Base64_encoding_and_decoding.

Я закончил использование функции, приведенной в блоге Daniel Guerrero: http://blog.danguer.com/2011/10/24/base64-binary-decoding-in-javascript/

Функция указана в ссылке github: https://github.com/danguer/blog-examples/blob/master/js/base64-binary.js

Используйте эти строки

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

Ответ 4

Только что нашёл base64-arraybuffer, небольшой пакет npm с невероятно высокой загрузкой, 5 миллионов загрузок в прошлом месяце (2017-08).

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

Для тех, кто ищет что-то лучшее стандартное решение, это может быть.

Ответ 5

Javascript - это отличная среда разработки, поэтому она кажется странной, чем не дает решения этой небольшой проблемы. Решения, предлагаемые в других местах на этой странице, потенциально медленные. Вот мое решение. Он использует встроенную функциональность, которая декодирует URL-адреса base64 изображения и звуковых данных.

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

Запрос на отправку завершается неудачно, если строка base 65 неправильно сформирована.

Тип MIME (application/octet), вероятно, не нужен.

Проверено в хром. Должно работать в других браузерах.

Ответ 6

Асинхронное решение лучше для больших данных:

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

Ответ 7

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