如何使用 Ajax 觸發檔案下載而不中斷使用者互動？

使用 Ajax 啟用檔案下載

在非同步程式設計時代，通常需要在不中斷使用者互動的情況下下載檔案。這個問題探討如何使用 Ajax 下載文件，同時提示使用者在本地儲存文件。

在提供的 Struts2 操作中，可以使用串流結果下載檔案。但是，使用 jQuery 直接發佈到此操作會將瀏覽器中的檔案呈現為二進位串流。要觸發文件下載窗口，需要採用不同的方法。

現代瀏覽器解決方案

現代瀏覽器提供了更簡單的解決方案。使用 fetch() API，您可以將檔案作為 blob 檢索並建立臨時 URL 進行下載。

fetch('https://jsonplaceholder.typicode.com/todos/1')
  .then(resp => resp.blob())
  .then(blob => {
    const url = window.URL.createObjectURL(blob);
    const a = document.createElement('a');
    a.style.display = 'none';
    a.href = url;
    // Set the download filename
    a.download = 'todo-1.json';
    document.body.appendChild(a);
    a.click();
    window.URL.revokeObjectURL(url);
    alert('File download complete!');
  })
  .catch(() => alert('File download failed!'));

此方法需要支援 fetch() API 和 createObjectURL() 的現代瀏覽器方法。

以上是如何使用 Ajax 觸發檔案下載而不中斷使用者互動？的詳細內容。更多資訊請關注PHP中文網其他相關文章！