ngFlowを使用してデータuri形式で画像を送信

Question

入力を使用して画像を読み込んだ後、データURI形式で変換してngImgCropディレクティブに渡して画像をトリミングします。

これまでのところ、私はこのすべての作業を行っていましたが、ngFlowを使用してデータURI形式のクロップされた画像をアップロードしようとしています。

私は成功していないいくつかの方法を試してきましたが、誰もこれを行うことができましたか？

私は何かが不足していると思いますが、.addFile()メソッドを使用してデータURI形式の画像を渡しましたが、この方法では動作しませんでした。

Answer 1

私は最終的にBlobを作成し、それをFlowのファイル配列にプッシュするソリューションを見つけました！

This StackOverflow answerも役に立ちました.Blobを作成するためにデータのuri形式のイメージをバイナリに変換する必要がありました（関数dataURItoBlob()は私のためにそれを行いました）。

は、ここでそれをやったコードです：

function uploadImage($flow) { 
    if ($flow) { 
    // 'vm.img.cropped' is the image in data uri format to upload 
    var blob = dataURItoBlob(vm.img.cropped); 
    blob.name = 'file.png'; 

    var file = new Flow.FlowFile($flow, blob); 
    $flow.files.push(file) 

    $flow.upload(); 
    } 
} 

function dataURItoBlob(dataURI) { 
    var binary = atob(dataURI.split(',')[1]); 
    var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0]; 
    var array = []; 
    for(var i = 0; i < binary.length; i++) { 
    array.push(binary.charCodeAt(i)); 
    } 
    return new Blob([new Uint8Array(array)], {type: mimeString}); 
};