首頁 > web前端 > js教程 > 為什麼 AJAX 不適用於檔案下載,最好的替代方案是什麼?

為什麼 AJAX 不適用於檔案下載,最好的替代方案是什麼?

Barbara Streisand
發布: 2024-12-09 17:50:12
原創
592 人瀏覽過

Why Doesn't AJAX Work for File Downloads, and What's the Best Alternative?

使用AJAX 請下載檔案:綜合指南

問題:嘗試啟動「ajax 下載要求」按一下按鈕後不會產生所需的結果。下面提供了JavaScript 和PHP 的演示:

JavaScript:

var xhr = new XMLHttpRequest();
xhr.open("GET", "download.php");
xhr.send();
登入後複製

PHP (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 請求啟動檔案下載是不可行的。對於此任務,需要直接存取該文件。

更新的解決方案(2015 年4 月27 日):

使用「下載」屬性:

  • HTML5 引入了「下載」屬性。它受到 Firefox 和 Chrome 的支持,並且很快就會被包含在 IE11 中。它允許在同源直接下載檔案。

JavaScript:

// Check if 'download' is supported
if ('download' in HTMLAnchorElement.prototype) {
    // Create an anchor element
    var anchor = document.createElement('a');

    // Set 'download' attribute and file URL
    anchor.download = 'file.txt';
    anchor.href = 'download.php';

    // Trigger file download
    anchor.click();
} else {
    // Fallback to previous method
    window.location = 'download.php';
}
登入後複製

原始解決方案:

使用'window.location':

  • 與 AJAX 請求不同,'window.location' 直接導航到文件,觸發下載。

JavaScript :

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

為了簡單起見,建議避免完全使用 AJAX 請求,只需使用「window.location」即可。

以上是為什麼 AJAX 不適用於檔案下載,最好的替代方案是什麼?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板