1

重複の可能性:
JQuery AJAX Post 経由でのダウンロードが機能しない

filedownload.php には以下のスニペントがあります。

$file = 'cut.png';
header("Content-Type: image/png");
header('Content-Disposition: attachment; filename="'.$file.'"');
header("Content-Type: application/force-download");
header("Content-Type: application/octet-stream");
header("Content-Type: application/download");
readfile($file);
exit();

AJAX 呼び出し

jQuery.post('filedownload.php',{            
  'file'  :  result  // not used for the time being                    
 });

ファイルに対して ajax 呼び出しを行いfiledownload.phpます。ユーザーがファイルをダウンロードすることはできません。しかし、php を直接実行すると、ユーザーはファイルをダウンロードできます。問題は何ですか？

jQuery プラグインを使用するのではなく、コア関数を使用したいと考えています。無理ならプラグインでもいいです。

ページを更新できないため、ajaxを使用しています。

4

1 に答える 1

3

問題

開く、保存する、インポートする、エクスポートする機能を備えた、スプレッドシート エディターなどの生産性 Web アプリの例を見てみましょう。開くオプションと保存するオプションでは、データベースからスプレッドシートをロードする必要がありますが、インポートとエクスポートでは、ユーザーのマシン上のローカル ファイルを処理します。エクスポート動作を実装するには、ユーザーが最初にスプレッドシートを保存して、データをバックエンドからファイルにエクスポートできるようにする必要があると判断する場合があります。しかし、代わりに、サーバーにデータを保存せずにローカルで作業するオプションをユーザーに提供するために、ユーザーがデータを保存せずにエクスポートできるようにしたいとします。これを行うには、現在のスプレッドシート データをバックエンドに送信し、ダウンロードするファイルを受信する必要があります。残念ながら、これは Ajax では対応できず、Ajax はテキスト形式でしか応答を受信できないためです。保存するデータがかなり長い場合、これはかなりの問題を引き起こします。

回避策

リクエストを行うには、GET または POST を使用して通常の (Ajax ではない) HTTP リクエストを行う必要があります。データがかなり短い場合は、GET リクエストで問題を解決できますが (おそらく単に Window.location をエクスポート URL に設定するだけです)、GET リクエストの長さに関するブラウザーの制限が異なるため、POST が必要になる可能性が高くなります。次のプラグインを使用すると、jQuery のネイティブ Ajax 関数と同様の構文でファイルを返すリクエストを作成できます。

問題を修正するjQueryコード

jQuery.download = function(url, data, method){
    //url and data options required
    if( url && data ){ 
        //data can be string of parameters or array/object
        data = typeof data == 'string' ? data : jQuery.param(data);
        //split params into form inputs
        var inputs = '';
        jQuery.each(data.split('&'), function(){ 
            var pair = this.split('=');
            inputs+='<input type="hidden" name="'+ pair[0] +'" value="'+ pair[1] +'" />'; 
        });
        //send request
        jQuery('<form action="'+ url +'" method="'+ (method||'post') +'">'+inputs+'</form>')
        .appendTo('body').submit().remove();
    };
};

呼び方

$.download('filedownload.php','filename='+filename );

続きを読む

于 2012-12-14T07:08:51.330 に答える