由于不同的瀏覽器兼容不同，對于直接a標簽下載文件，有的瀏覽器可以，有的瀏覽器會直接播放。
為了保證下載操作的正確執(zhí)行，需要做一些額外的操作。

這個操作就是a標簽的download屬性。

定義和用法
download 屬性規(guī)定被下載的超鏈接目標。
在 <a> 標簽中必須設(shè)置 href 屬性。
該屬性也可以設(shè)置一個值來規(guī)定下載文件的名稱。所允許的值沒有限制，瀏覽器將自動檢測正確的文件擴展名并添加到文件 (.img, .pdf, .txt, .html, 等等)。
如<a href="/images/myw3schoolimage.jpg" download="w3logo">

可以保證下載操作，同時還可以修改文件名。
但是，問題是不支持跨域文件下載。

為了滿足跨域文件的下載，還得做另一些額外的操作。

這個操作就是通過blob轉(zhuǎn)換。以axios為例，

axios({
  url: 'http://api.dev/file-download',
  method: 'GET',
  responseType: 'blob', // important
}).then((response) => {
   const url = window.URL.createObjectURL(new Blob([response.data]));
   const link = document.createElement('a');
   link.href = url;
   link.setAttribute('download', 'file.pdf'); //or any other extension
   document.body.appendChild(link);
   link.click();
});

首先將數(shù)據(jù)請求下來，然后再轉(zhuǎn)換成對象直接另存為文件。

完美解決。