2011-11-11 15 views
2

私はHTML5のドラッグ&ドロップを使用してユーザーのコンピュータから画像を取得し、そのファイルを自分のRailsサーバーにアップロードしたいとします(その目的のためにCarrierwaveを使用しています)。私はここで何をしているのか正確にはわかりませんが、このコードからこれらの指示を一緒に書きました。http://code.google.com/p/html5uploader/wiki/HTML5UploaderChromeのXHR経由で画像ファイルを送信する

これは500エラーを返します。誰かが私が間違っていることを見て助けてくれますか?

var files = e.dataTransfer.files; 
if (files.length){ 
    for (var i = 0; i<files.length; i++) { 
    var file = files[i]; 
    var reader = new FileReader(); 
    reader.readAsBinaryString(file); 
    reader.onload = function() { 
     var bin = reader.result; 
     var xhr = new XMLHttpRequest(); 
     var boundary = 'xxxxxxxxx'; 
     xhr.open('POST', '/images?up=true&base64=true', true); 
     xhr.setRequestHeader('content-type', 'multipart/form-data; boundary=' + boundary); 
     xhr.setRequestHeader('UP-FILENAME', file.name); 
     xhr.setRequestHeader('UP-SIZE', file.size); 
     xhr.setRequestHeader('UP-TYPE', file.type); 
     xhr.send(window.btoa(bin)); 
    }; 
    }; 
}; 

答えて

3

犯人になる可能性のあることがいくつかあります。ファイルをバイナリ文字列として読み込み、次にマルチパートリクエストを作成してからbase64でエンコードされた値を送信しています。

ファイルを読んだり、base64エンコーディングをする必要はありません。代わりに、FormDataオブジェクトを作成し、ファイルを追加して、xhr.send(formData)を使用して直接送信してください。私の反応hereを参照してください。

関連する問題