首頁 >web前端 >js教程 >如何透過Ajax請求觸發檔案下載?

如何透過Ajax請求觸發檔案下載?

Mary-Kate Olsen
Mary-Kate Olsen原創
2024-12-19 14:56:09998瀏覽

How Can I Trigger File Downloads with Ajax Requests?

使用 Ajax 要求下載檔案

使用 Ajax 實作點擊按鈕即可下載檔案的功能可能會遇到挑戰。讓我們來探索克服這些障礙的解決方案。

初始嘗試

實現這一目標的初始嘗試包括創建 XMLHttpRequest 並向 PHP 腳本發送 GET請求,如下所示顯示如下:

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

download.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");
?>

限制

但是,由於瀏覽器的限制,此方法存在不足。 Ajax請求不能直接觸發下載提示;相反,必須導航到該文件才能發生。

有兩種方法可用:

1。使用window.location 和Fallback

利用window.location 屬性導覽至下載腳本,觸發下載:

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

2. HTML5 下載屬性

對於現代瀏覽器,可以使用HTML5下載屬性:
<a href="download.php" download>
  Download File
</a>

注意:

-

下載屬性僅在 Chrome、Firefox 及更高版本的 Internet中支援Explorer.

-

確保要下載的檔案與主頁同源。

以上是如何透過Ajax請求觸發檔案下載?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn