前端 - 文件下载实现方案

接口：

export function exportOrder(query = {}) {
  // 拼接查询字符串
  let r = queryParams(query)
  return axios.post(
    `/admin/order/excelexport${r}`,
    {},
    {
      // responseType 设置为 blob 二进制流的方式
      responseType: 'blob',
    }
  )
}

调用

exportOrder({ tab: form.tab, starttime, endtime })
    .then(data => {
      // console.log(res)
      // URL.createObjectURL()方法会根据传入的参数创建一个指向该参数对象的URL. 这个URL的生命仅存在于它被创建的这个文档里. 新的对象URL指向执行的File对象或者是Blob对象
      let url = window.URL.createObjectURL(new Blob([data]))
      let link = document.createElement('a')
      link.style.display = 'none'
      link.href = url
      let filename = new Date().getTime() + '.xlsx'
      // a标签加上downlaod属性后，就可完成对href属性链接文件的下载，但仅仅是限于同源文件，如果是非同源，download属性会失效
      link.setAttribute('download', filename)
      document.body.appendChild(link)
      link.click()
      // 释放的 URL 对象以及移除 a 标签
      URL.revokeObjectURL(link.href)
      document.body.removeChild(link)
      close()
    })
    .finally(() => {
      loading.value = false
    })