当前位置:   article > 正文

VUE根据url下载文件_vue通过url下载文件

vue通过url下载文件

方法一:

  1. const downloadRes = async () => {
  2. let response = await fetch(url);
  3. let blob = await response.blob();
  4. let objectUrl = window.URL.createObjectURL(blob);
  5. let a = document.createElement('a');
  6. a.href = objectUrl;
  7. a.download = res.success.fileName;
  8. a.click()
  9. a.remove();
  10. }
  11. downloadRes();

方法二:(会出现跨域问题)

  1. fetch(url).then(res => res.blob()).then(blob => { // 将链接地址字符内容转变成blob地址
  2. const a = document.createElement('a')
  3. a.href = URL.createObjectURL(blob)
  4. console.log(a.href)
  5. a.download = res.success.fileName // 下载文件的名字
  6. document.body.appendChild(a)
  7. a.click()
  8. })

方法三:不跳转页面,直接下载。最完美!!!

  1. if (res.code === 0) {
  2. let url = res.success.url
  3. const a = document.createElement('a')
  4. a.href = url
  5. a.download = res.success.fileName // 下载后文件名
  6. a.style.display = 'none'
  7. document.body.appendChild(a)
  8. a.click() // 点击下载
  9. document.body.removeChild(a) // 下载完成移除元素
  10. }

方法四:最简单粗暴,一行代码搞定

window.location.href = res.success.url

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/你好赵伟/article/detail/683442
推荐阅读
相关标签
  

闽ICP备14008679号