勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ。

jQueryでAjax通信したデータをPHPで受け取り、zip化したファイルをダウンロードさせる方法

  jQuery JavaScript

jQueryのAjaxで何らかのデータをPHP側に送信し、PHP側で当該データをファイルに書き込んだ上でzipファイル化し、ブラウザからダウンロードさせたい。PHP経由でzipファイルダウンロードは以前に行ったが、さらにAjax経由というのは対応したことが無かったので以下にソースコード等をメモ。

 

対応方法

PHP側

PHP側については以前にメモした方法でzipファイルを出力させること。Ajaxから受信したデータは$_REQUEST等で取り扱うと良い。

Ajax側

【PHP側のURL】【Ajaxで送信したいデータ】【ダウンロードさせたいファイル名】部分は適宜変更すること。

$('#download').on('click', function(){
    $.ajax({
        type: 'post',
        url: '【PHP側のURL】',
        data: {【Ajaxで送信したいデータ】},
        xhrFields: { responseType: 'blob' }
    }).done(function (response, _textStatus, _jqXHR) {
        $('<a>', {
            href: URL.createObjectURL(new Blob([response], { type: response.type })),
            download: "【ダウンロードさせたいファイル名】",
        }).appendTo(document.body)[0].click();
    });

    return false;
});

 - jQuery JavaScript

  関連記事

jQueryで画像を遅延ロードする「jquery.lazyload.js」の利用方法

画像を遅延ロードさせたい時にはjQueryプラグインのlazyloadが便利。以 ...

日付入力のテキストフォームにカレンダープラグインを導入

やりたかった事と制限は下記の通り。 ・日付入力のテキストフォームにカレンダープラ ...

JavaScript / jQueryで〇番目、最初、最後の要素を指定する方法

jQueryでリストタグ(<li>)の〇番目、最初、最後の要素を指定 ...

NicEdit(WYSIWYGエディタ)を再描写時にサイズを調整する方法

NicEdit(WYSIWYGエディタ)を設置しているサイトがあった。ページ読み ...

スクロールしてもついてくる追尾型の広告を作る方法

スマホサイトとかでよく見る、スクロールしてもページ下部とかに常時表示されている追 ...