4

アップロードフィールドのあるExtJsフォームがあります。フォームを要約すると、Accept-headerが間違っています。応答はJSONですが、送信されるAccept-headerは次のとおりです。

Accept:text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8

私の知識に基づく推測では、これはブラウザのデフォルト値です。

Chromeでは、これにより警告が発生します。リソースはドキュメントとして解釈されますが、MIMEタイプapplication/jsonで転送されます。

FireFoxでは、これによりファイルがダウンロードされます。

結論：Accept-headerを次のように変更/設定する必要がありますapplication/json

Senchaのドキュメントにはheadersパラメータがあると書かれていますが、私はテストしましたが、fileuploadでは機能しません。コメントによると、サポートされていません。（別のスレッドで同じ結果が見つかりました）

ファイルのダウンロードを削除する/適切なAccept-headerを設定するための提案...ExtJsソリューションである必要はありません。ファイルアップロードフォームにacceptヘッダーを設定するためのプレーンなjavaScriptソリューションを提供できれば、おそらくそれをsenchaフレームワークに組み込むことができます。

アップデート：

ExtJSフォームの送信：

form.submit({
    url: API_URLS.addDocument,
    waitMsg: 'Uploading your document...',
    headers: {
        "Accept": 'application/json' //doesn't work
    },
    success: function() {
        ...
    },
    failure: function(){
        ...
    }
});

舞台裏では、次のような通常のフォームを作成します。

<form action="API_URLS.addDocument" enctype="multipart/form-data" method="post">
    <input type="file"/>
</form>

javaScript（submit()）を介して送信できます

4

1 に答える 1

6

ヘッダーは、Acceptサーバーに特定のタイプのデータで応答するように要求しているだけです。デフォルトのヘッダーの*inは、「またはその他」を意味します（ただし、q値はそれよりも優先度が低くなります）。

応答がJSONで、JSONが必要な場合は、Acceptヘッダーに触れる必要はまったくありません。

問題は、行間を正しく読んでいる場合、iframeを使用してAjaxファイルのアップロードを実行しようとしており、FirefoxがJSONファイルをドキュメントとしてレンダリングしようとしないことです。

これを回避するには2つの方法があります。

  1. 応答をJSONではなくHTMLとして提示し、DOMを使用してそこからデータを抽出します
  2. iframeの代わりに、XMLHttpRequest2とFileAPIを使用してファイルをアップロードします。（注：これは、ブラウザーのサポートが制限されている新しいAPIを使用します）。
于 2012-11-12T14:16:16.677 に答える