47

このアプリケーションでは、次のシナリオを実装する必要があります。

  1. クライアントからリクエストが送信されます
  2. サーバーがリクエストを処理し、ファイルを生成します
  3. サーバーは応答としてファイルを返します
  4. クライアントブラウザはファイルダウンロードポップアップダイアログを表示し、ユーザーがファイルをダウンロードできるようにします

私たちのアプリケーションはajaxベースのアプリケーションであるため、ajaxリクエストを送信するのは非常に簡単で便利です（jquery.ajax()関数の使用など）。

しかし、googilngの後、ファイルのダウンロードは、ajax以外のPOSTリクエストを使用している場合にのみ可能であることが判明しました（この人気のあるSOスレッドで説明されているように）。formそのため、ネストされた非表示フィールドを使用してHTML構造を構築する必要がある、より醜く複雑なソリューションを実装する必要がありました。

誰かが簡単な言葉で説明できますか？なぜajaxリクエストを使用してファイルをダウンロードできないのですか？その背後にあるメカニズムは何ですか？

4

4 に答える 4

59

それはAJAXについてではありません。もちろん、AJAXでファイルをダウンロードすることもできます。ただし、ファイルはメモリに保持されます。つまり、ファイルをディスクに保存することはできません。これは、JavaScriptがディスクと対話できないためです。これは重大なセキュリティ問題であり、すべての主要なブラウザでブロックされています。

于 2013-02-04T08:52:46.127 に答える
3

これは、Blobと呼ばれる新しいHTML5機能を使用して実行できます。その機能の上にラッパーとして利用できるライブラリFileSaver.jsがあります。

于 2015-07-17T13:57:55.370 に答える
1

それは私が2日前に自分自身に尋ねたのと同じ質問です。ExtJSを使用して作成されたクライアントを使用したプロジェクトがあり、サーバー側の実現はASP.Netで行われました。サーバー側をJavaに変換する必要があります。クライアントからのAjaxリクエストの後にサーバーが生成するXMLファイルをダウンロードする機能がありました。Ajaxリクエストの後でファイルをダウンロードして、メモリに保存するだけでは不可能であることは誰もが知っています。しかし...元のアプリケーションブラウザでは、オプションを開いて保存し、ダウンロードをキャンセルする通常のダイアログが表示されます。ASP.Netはどういうわけか標準の動作を変更しました...再度証明するのに2日かかります-通常の方法でファイルをダウンロードする方法はありません...唯一の例外はASP.Netです...これがASP.Netですコード

public static void WriteFileToResponse(byte[] fileData, string fileName)
    {
        var response = HttpContext.Current.Response;

        var returnFilename = Path.GetFileName(fileName);
        var headerValue = String.Format("attachment; filename={0}", 
            HttpUtility.UrlPathEncode(
                String.IsNullOrEmpty(returnFilename) 
                    ? "attachment" : returnFilename));
        response.AddHeader("content-disposition", headerValue);
        response.ContentType = "application/octet-stream";
        response.AddHeader("Pragma", "public");

        var utf8 = Encoding.UTF8;
        response.Charset = utf8.HeaderName;
        response.ContentEncoding = utf8;
        response.Flush();
        response.BinaryWrite(fileData);
        response.Flush();
        response.Close();
    }

このメソッドはWebMethodから呼び出され、WebMethodはExtJS.Ajax.requestから呼び出されました。それが魔法です。私にとっては、サーブレットと非表示のiframeで終了しました...

于 2013-02-04T09:30:12.783 に答える
-3

ダウンロードページで非表示のiframeを使用してこれを行うことができます

ajax成功応答に非表示のifameのsrcを設定するだけで、タスクが完了します...

  $.ajax({
        type: 'GET',
        url: './page.php',
        data: $("#myform").serialize(),
        success: function (data) {
          $("#middle").attr('src','url');
        },

});
于 2014-03-17T13:36:49.327 に答える