侧边栏壁纸
  • 累计撰写 12 篇文章
  • 累计创建 14 个标签
  • 累计收到 1 条评论

目 录CONTENT

文章目录

VUE 前端如何通过API下载文件

马化云
2022-04-08 / 0 评论 / 0 点赞 / 225 阅读 / 948 字
温馨提示:
本文最后更新于 2022-04-10,若内容或图片失效,请留言反馈。部分素材来自网络,若不小心影响到您的利益,请联系我们删除。
download(data) {
      console.log(data)
      <!--调用接口获取字节数据-->
      sysFileInfoDownload({ id: data.fileId })
        .then((res) => {
          this.downLoadFile(res)
        })
        .catch((err) => {
          this.$message.error('下载错误:获取文件流错误')
        })
    },
downLoadFile(res) {
	   <!--根据需要下载的文件设置好type-->
      var blob = new Blob([res.data], { type: 'application/octet-stream;charset=UTF-8' })
      var contentDisposition = res.headers['content-disposition']
      var patt = new RegExp('filename=([^;]+\\.[^\\.;]+);*')
      var result = patt.exec(contentDisposition)
      var filename = result[1]
      var downloadElement = document.createElement('a')
      var href = window.URL.createObjectURL(blob) // 创建下载的链接
      var reg = /^["](.*)["]$/g
      downloadElement.style.display = 'none'
      downloadElement.href = href
      downloadElement.download = decodeURI(filename.replace(reg, '$1')) // 下载后文件名
      document.body.appendChild(downloadElement)
      downloadElement.click() // 点击下载
      document.body.removeChild(downloadElement) // 下载完成移除元素
      window.URL.revokeObjectURL(href)
    }

VUE
博主关闭了所有页面的评论