欧美成人精品手机在线观看_69视频国产_动漫精品第一页_日韩中文字幕网 - 日本欧美一区二区

在前端導出和下載后端返回的文件流時，可以使用以下幾種方法：

使用window.open()方法：

在前端使用window.open()方法打開一個新的窗口或標簽頁，并將后端返回的文件流作為URL傳遞給該方法。瀏覽器會自動下載該文件。

例如：window.open('http://example.com/download', '_blank');

使用<a>標簽的download屬性：

創建一個隱藏的<a>標簽，設置href屬性為后端返回的文件流的URL，同時設置download屬性為文件的名稱。然后使用Javascript模擬點擊該標簽，觸發文件下載。

例如：

const link = document.createElement('a');

link.href = 'http://example.com/download';

link.download = 'filename.ext';

link.click();

使用Fetch API或XHR請求：

使用Fetch API或XHR（XMLHttpRequest）發送請求，獲取后端返回的文件流，并使用Blob對象創建一個URL。然后將該URL傳遞給<a>標簽的href屬性，并使用Javascript模擬點擊該標簽，觸發文件下載。

例如：

fetch('http://example.com/download')

  .then(response => response.blob())

  .then(blob => {

    const url = URL.createObjectURL(blob);

    const link = document.createElement('a');

    link.href = url;

    link.download = 'filename.ext';

    link.click();

  });

這些方法可以根據具體的需求和項目環境選擇使用。需要注意的是，后端返回的文件流需要正確設置Content-Disposition響應頭，以指定文件的名稱和下載方式。

除了上述提到的方法，還有以下五種方法可以實現前端導出和下載后端返回的文件流：

使用HTML5的download屬性：

創建一個<a>標簽，設置href屬性為后端返回的文件流的URL，同時設置download屬性為文件的名稱。將該標簽插入到DOM中，并使用Javascript模擬點擊該標簽，觸發文件下載。

例如：

const link = document.createElement('a');

link.href = 'http://example.com/download';

link.download = 'filename.ext';

document.body.appendChild(link);

link.click();

document.body.removeChild(link);

使用FileSaver.js庫：

引入FileSaver.js庫，使用saveAs()方法將后端返回的文件流保存為本地文件。需要將后端返回的文件流轉換為Blob對象。

例如：

import { saveAs } from 'file-saver';

fetch('http://example.com/download')

  .then(response => response.blob())

  .then(blob => {

    saveAs(blob, 'filename.ext');

  });

使用iframe：

創建一個隱藏的iframe，將其src屬性設置為后端返回的文件流的URL。瀏覽器會自動下載該文件。

例如：

const iframe = document.createElement('iframe');

iframe.style.display = 'none';

iframe.src = 'http://example.com/download';

document.body.appendChild(iframe);

使用FormData和XMLHttpRequest：

創建一個FormData對象，將后端返回的文件流作為Blob對象添加到FormData中。然后使用XMLHttpRequest發送請求，將FormData作為請求體發送到后端進行下載。

例如：

const formData = new FormData();

formData.append('file', blob, 'filename.ext');

const xhr = new XMLHttpRequest();

xhr.open('POST', 'http://example.com/download');

xhr.send(formData);

使用axios庫：

使用axios庫發送請求，獲取后端返回的文件流，并將其保存為本地文件。需要將后端返回的文件流轉換為Blob對象。

例如：

import axios from 'axios';

axios.get('http://example.com/download', { responseType: 'blob' })

  .then(response => {

    const blob = new Blob([response.data]);

    const url = URL.createObjectURL(blob);

    const link = document.createElement('a');

    link.href = url;

    link.download = 'filename.ext';

    link.click();

  });

這些方法提供了多種選擇來實現前端導出和下載后端返回的文件流。根據具體的需求和項目環境，選擇適合的方法進行實現。

————————————————

版權聲明：本文為CSDN博主「一花一world」的原創文章，遵循CC 4.0 BY-SA版權協議，轉載請附上原文出處鏈接及本聲明。

原文鏈接：https://blog.csdn.net/ACCPluzhiqi/article/details/132514874