Сохранить изображение для удаления с данными с холста

Question

Я пытаюсь записать данные холста в виде изображения (png) в мой Dropbox. Мне удается получить данные с холста и сохранить файл в dropbox, но файл не является файлом изображения, который он швыряет.

Согласно документации данные изображения должны быть преобразованы в arrayBuffer. Что я делаю, используя функцию, найденную здесь в Stackoverflow, но что-то не работает. Кто-нибудь знает, что я делаю неправильно?

function _str2ab(str) { 
    var buf = new ArrayBuffer(str.length*2); // 2 bytes for each char 
    var bufView = new Uint16Array(buf); 
    for (var i=0, strLen=str.length; i<strLen; i++) { 
     bufView[i] = str.charCodeAt(i); 
    } 
    return buf; 
} 

function _savePicture() { 

    //Get data from canvas 
    var imageSringData = canvas.toDataURL('image/png'); 
    //Convert it to an arraybuffer 
    var imageData = _str2ab(imageSringData); 

    client.writeFile('/Public/the_image.png', imageData, function(error, stat) { 
    if (error) { 
     console.log('Error: ' + error); 
    } else { 
     console.log('File written successfully!'); 
    } 
}); 

Ниже приведена документация по коробке передач. https://github.com/dropbox/dropbox-js/blob/stable/guides/snippets.md

Answer 1

Получил работу, наконец,! Я использовал другую функцию, чтобы преобразовать base64 в bufferArray и удалить «data: image/png; base64» из строки, и она сработала. Надеюсь, это поможет кому-то еще в будущем.

function _base64ToArrayBuffer(base64) { 
    base64 = base64.split('data:image/png;base64,').join(''); 
    var binary_string = window.atob(base64), 
     len = binary_string.length, 
     bytes = new Uint8Array(len), 
     i; 

    for (i = 0; i < len; i++)  { 
     bytes[i] = binary_string.charCodeAt(i); 
    } 
    return bytes.buffer; 
} 

function _savePicture() { 
    //Get data from canvas 
    var imageSringData = canvas.toDataURL('image/png'); 
    //Convert it to an arraybuffer 
    var imageData = _base64ToArrayBuffer(imageSringData); 

    client.writeFile('/Public/the_image.png', imageData, function(error, stat) { 
    if (error) { 
     console.log('Error: ' + error); 
    } else { 
     console.log('File written successfully!'); 
    } 
});