ホームページ >ウェブフロントエンド >jsチュートリアル >AJAX を使用してファイルのダウンロードをトリガーするにはどうすればよいですか?また最良の方法は何ですか?

AJAX を使用してファイルのダウンロードをトリガーするにはどうすればよいですか?また最良の方法は何ですか?

Barbara Streisand
Barbara Streisandオリジナル
2024-12-06 02:04:10540ブラウズ

How Can I Trigger a File Download Using AJAX, and What Are the Best Methods?

AJAX 主導のファイル ダウンロード: ガイド

Web 開発の領域では、次のコマンドを使用してサーバーからファイルを直接ダウンロードする必要があります。 AJAX リクエスト。これを実現するには、さまざまなアプローチを利用できます。

標準的なアプローチの 1 つは、ボタンをクリックしたときに AJAX リクエストを開始することです。これを試みるスクリプトは次のとおりです:

var xhr = new XMLHttpRequest();
xhr.open("GET", "download.php");
xhr.send();

ダウンロード用にファイルを提供するには、次のような PHP スクリプトを使用できます:

<?php
header("Cache-Control: public");
header("Content-Description: File Transfer");
header("Content-Disposition: attachment; filename= file.txt");
header("Content-Transfer-Encoding: binary");    
readfile("file.txt");
?>

ただし、この方法では目的のものが生成されない可能性があります。行動。したがって、代替戦略が必要です。

最新の解決策: ダウンロード属性の導入

HTML5 環境に新たに登場したのは、ダウンロード属性です。 Firefox や Chrome (および間もなく IE11) などの著名なブラウザーでサポートされるこの属性は、ファイルのダウンロードのためのより効率的なソリューションを提供します。

<a href="file.txt" download="file.txt">Download File</a>

ファイルが Web サイトと同じオリジンに存在する限り、この属性を使用してダウンロードできます。

従来のソリューション: AJAX と Window の利用リダイレクト

download 属性が登場する前は、AJAX リクエストまたは window.location 操作を使用する回避策がありました。

$.ajax({
    url: 'download.php',
    type: 'POST',
    success: function() {
        window.location = 'download.php';
    }
});

ただし、window.location を直接使用するのはさらに困難です。このコンテキストでは効率的なソリューションです。

以上がAJAX を使用してファイルのダウンロードをトリガーするにはどうすればよいですか?また最良の方法は何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。