javascript（クライアント側）を使用して画像をデータベースに送信

Question

私は自分の画像をアップロードできる入力タグを使用しています。完了したら、自分のサーバー（node.jsサーバー）にイメージを送信し、それを自分のデータベースに送ります。 クライアント側でどうすればいいですか？ base64でイメージファイルをエンコードする必要がありますか？ 私は画像を表示する機能を持っていますが、ここでは便利かどうかは分かりません。

JS：

avatar.onchange = function() { 
    var reader = new FileReader(); 

    reader.onload = function(e) { 
    // get loaded data 
    image.src = e.target.result; 
    }; 
    // read the image file as a data URL. 
    reader.readAsDataURL(this.files[0]); 
}; 

HTML：事前に

<input id="avatar" type="file" onchange="previewFile()"> 
<img id="image" width="200px"> 

感謝。

Answer 1

十分なはずですが、readAsDataURLは既にファイルをbase64文字列としてエンコードします。サーバーで

、あなたのデータベースに直接このデータURLを保存しますが、次のようにデータのURL文字列の形式が可能になることを心に留めておくことができます。

data:[<mediatype>][;base64],<data> // data is base64 

あなたは、保存または使用する必要がある場合サーバー上のファイルを直接、<data>（たとえばRegexまたはsplitを使用）の前にすべてを取り除き、適切な拡張子を持つファイルを[<mediatype>]に保存してください。あなたは、ブラウザ側でbase64でエンコードされたデータをデコードする必要がある場合は

let buff = Buffer.from(base64string, "base64"); // converts base64 back to binary 

、あなたがそうのようatobを使用することができます：

をここで

は Bufferとノードでbase64でエンコードされたデータを復号化する例を示します

let data = atob(base64string); // back to decoded string