本文主要來源于知乎一個回答，這里紅色部分做了自己的處理，雖然自己的少，可是很有用的幾句代碼哦

只好回答一下axios如何攔截get請求并下載文件的了。

Ajax無法下載文件的原因

瀏覽器的GET(frame、a)和POST(form)請求具有如下特點：

response會交由瀏覽器處理

response內(nèi)容可以為二進制文件、字符串等

Ajax請求具有如下特點：

response會交由Javascript處理

response內(nèi)容僅可以為字符串

因此，Ajax本身無法觸發(fā)瀏覽器的下載功能。

Axios攔截請求并實現(xiàn)下載

為了下載文件，我們通常會采用以下步驟：

發(fā)送請求

獲得response

通過response判斷返回是否為文件

如果是文件則在頁面中插入frame

利用frame實現(xiàn)瀏覽器的get下載

我們可以為axios添加一個攔截器：

import axios from 'axios'// download urlconst downloadUrl = url => { let iframe = document.createElement('iframe') iframe.style.display = 'none' iframe.src = url iframe.onload = function () { document.body.removeChild(iframe) } document.body.appendChild(iframe)}// Add a response interceptoraxios.interceptors.response.use(c=> { // 處理excel文件 if (res.headers && (res.headers['content-type'] === 'application/x-msdownload' || res.headers['content-type'] === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet')) { downloadUrl(res.request.responseURL)  <span style="color:#ff0000;"> res.data=''; res.headers['content-type'] = 'text/json' return res;</span> } ... return res;}, error => { <span style="color:#ff0000;">// Do something with response error return Promise.reject(error.response.data || error.message)</span>})export default axios

之后我們就可以通過axios中的get請求下載文件了。

以上這篇vue.js 使用axios實現(xiàn)下載功能的示例就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持錯新站長站。