下载文件vue

最新推荐文章于 2023-05-11 16:52:49 发布

「已注销」

最新推荐文章于 2023-05-11 16:52:49 发布

阅读量237

点赞数

分类专栏： vue 文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/weixin_49547540/article/details/123098474

版权

vue 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

下载文件

window.location.href=‘http://www.baidu.com/down/downFile.txt?name=资源文件’;

这种情况下载时:文件名资源文件会中文乱码，解决办法：encodeURI(fileUrl, “utf-8”);

var newFileUrl=encodeURI(‘http://www.baidu.com/down/downFile.txt?name=资源文件’, “utf-8”);

href

window.location.href = this.downloadUrl

不能带token

blob

this.downloadApi({},this.downloadUrl).then((res) => {
// 带token等请求路由后，blob
        console.log(res)
        // this.btnLoading = false;
        if (res.type) {
          // 文件下载
          const blob = new Blob([res], {
            type: "application/vnd.ms-excel"
          });
          let link = document.createElement('a')
          link.href = URL.createObjectURL(blob)
          var fileName = this.title +'导入模板.xlsx'
          link.setAttribute('download', fileName)
          link.click()
          link = null
        }
      }).catch(err => {
        console.log(err)
});

export function downloadApi (data,url) {
  return request({
    url: url,
    method: 'GET',
    data,
    responseType: "blob"
  })
}

form

downloadFile(item) {
      const _this = this
      const params = {
        // 参数
        id: item.id,
        accessToken: _this.$store.state.user.token
      }
      const form = document.createElement('form')
      form.id = 'form'
      form.name = 'form'
      document.body.appendChild(form)
      for (const obj in params) {
        if (params.hasOwnProperty(obj)) {
          var input = document.createElement('input')
          input.type = 'hidden'
          input.name = obj
          input.value = params[obj]
            // 加id和token
          form.appendChild(input)
        }
      }
      form.method = 'GET' // 请求方式
      form.action = '/api/tds/file/downLoadFile'
      form.submit()
      document.body.removeChild(form)
    }