文件流、url下载

blob下载

         请求响应类型设置为blob，动态创建<a> 元素来触发下载操作。

downloadFile() {
  axios({
    url: '/api/download', // 替换为你的接口地址
    method: 'GET',
    responseType: 'blob' // 重要：将响应类型设置为 blob
  }).then(response => {
    const blob = new Blob([response.data])
    const link = document.createElement('a');
    link.href = window.URL.createObjectURL(blob)
    let fileName = ''
        try {
          fileName = decodeURIComponent(res.headers['contentdisposition'].split('filename=')[1])
        } catch (error) {
          console.log('解析文件名称错误')
          fileName = 'undefined.xlsx'
        }
    link.download = fileName
    link.click()
  });
}

url下载 

        将实际的文件 url 作为参数传递给downloadFile()方法，使用 Fetch API 发起 GET 请求，并使用 Blob 对象来处理文件数据，即可完成文件下载。

downloadFile(url) {
    const fileName = url.slice(url.lastIndexOf('/') + 1)
    fetch(url)
    .then((res) => res.blob())
    .then((blob) => {
      const link = document.createElement('a')
      link.href = window.URL.createObjectURL(blob)
      // 下载文件的名称及文件类型后缀
      link.download = fileName
      document.body.appendChild(link)
      link.click()
      // 在资源下载完成后 清除 占用的缓存资源
      window.URL.revokeObjectURL(link.href)
      document.body.removeChild(link)
  })
}