«

关于a标签跨域下载文件download属性不生效的解决方式

六思逸 发布于 阅读:4106 JavaScript


  1. 问题描述:如果使用标签进行文件下载,由于url跨域导致,a标签的download 属性设置下载文件名称不会生效。

  2. 解决方法:通过给a标签的click事件绑定一个函数来解决

<a @click="downloadFile(fileUrl, fileName)">点击下载</a>

> 函数如下

 function downloadFile(url, fileName) {
    var x = new XMLHttpRequest();
    x.open('GET', url, true);
    x.responseType = 'blob';
    x.onload = function () {
      var url = window.URL.createObjectURL(x.response);
      var a = document.createElement('a');
      a.href = url;
      a.download = fileName;
      a.click();
    };
    x.send();
  }

a标签下载文件


扫描二维码,在手机上阅读