4

HTML5 ファイル API を使用して、XHR から Web サービスに送信するためのマルチパート フォーム データを組み立てています。ファイル API の実装に便利な getAsBinary() メソッドが含まれている FF ですべての作業を行っています。これはかなり甘い取引でした。それは基本的に行きました：

var const;  // constructor
const += headers;
const += field_data;

for(var i = 0; i < files.length; i++)
{
   const += files[i].getAsBinary();
}

sendData(const);

魅力のように働きました。

ただし、Chrome で動作させるには、FileReader オブジェクトを作成する必要があります。このオブジェクトの処理は少し異なります。私は本質的に行かなければなりません：

var const;  // constructor
const += headers;
const += field_data;

var reader = new FileReader();

for(var i = 0; i < files.length; i++)
{
    reader.onload = (function(file)
    {
       const += file.target.result;   // const is not in scope in this anonymous function!
    }
    reader.readAsBinaryString(files[i]);
}

sendData(const);

主な理由は 2 つあります。まず、読み取りは非同期で行われるため、sendData() 関数に到達するまでに、ファイル データは const 変数に書き込まれません。第 2 に、const 変数は、reader.onload ハンドラー内の範囲外です。ただし、コードを再調整すると、これらの障害の1つに遭遇したようで、それを適切に処理する方法を考え出すのに苦労しています。

助言がありますか？

4

2 に答える 2

3

あなたがしなければならないことは、リーダーの「ロード」ハンドラーをすべてチェックして、最後に実行するハンドラーかどうかを確認することです。その場合、そのハンドラは「sendData()」を呼び出すことができます。

var const;  // constructor
const += headers;
const += field_data;

var reader;
var finished = 0;
for(var i = 0; i < files.length; i++)
{
    reader = new FileReader();
    reader.onload = function(file)
    {
       const += file.target.result;
       if (++finished === files.length)
         sendData(const);
    };
    reader.readAsBinaryString(files[i]);
}

(蓄積された「const」がどのように正しくマルチパート MIME blob になるかについての詳細は完全には理解していませんが、あなたは理解していると思います :-) また、これはおそらく重要です:おそらく作成する必要があると思います各ファイルの新しい「FileReader」インスタンス。私はこれをそのようにコーディングしました (実際には編集しただけです) が、API とそのセマンティクスに精通していないため、これは正しくない可能性があります。

于 2011-03-19T14:44:58.573 に答える
1

検討しましたxhr.send(FormData)か？ここで私の応答を参照してください:クロム拡張機能から php $_FILE にアップロードします

ファイルを FormData オブジェクトに追加して、xhr 経由で送信できます。ブラウザがマルチパート リクエストを作成します。これは FF4 で利用可能で、しばらくの間 Chrome にあると思います。

于 2011-05-18T17:18:44.387 に答える