JavaScript v2を使用してBase64の画像データをDropboxに転送

Question

現在、Dropboxを使用しているWebアプリケーションの機能を開発中です。少し新しくなっています。この機能には、HTML 5 Canvasを使用してイメージを編集し、キャンバスイメージをDropboxに保存することが含まれます。

私がしようとしているのは、キャンバスイメージをbase64イメージデータに変換し、クライアントサイドでのみJavaScriptを使用してDropboxに直接書き込むことです。

です。Dropbox API v1は廃止予定ですので、これをv2で実装しようとしています。

私はいくつかの掘削を行ってきたが、私は見つけることができる例のほとんどは、このように、バージョン1のAPIでWRITEFILEの方法を使用していた。 Save image to dropbox with data from canvas

ので、私はちょうど私は、これはで動作するように取得できるか疑問に思いますv2 API？

ありがとうございました。

Answer 1

これは将来的に誰かを助けることを望みます。

あなたが試した任意のコードを持っていますかあなたは、この

var canvas = document.getElementById("paint"); 

function uploadFile() { 
    var ACCESS_TOKEN = "xxx"; 
    var dbx = new Dropbox({ 
    accessToken: ACCESS_TOKEN 
    }); 
    var fileInput = document.getElementById('file-upload'); 
    var file = fileInput.files[0]; 


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


    dbx.filesUpload({ 
     path: '/' + "test.png", 
     contents: imageData 
    }) 
    .then(function(response) { 
     var results = document.getElementById('results'); 
     results.appendChild(document.createTextNode('File uploaded!')); 
     console.log(response); 
    }) 
    .catch(function(error) { 
     console.error(error); 
    }); 
    return false; 
} 



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