JS实现文件下载(含跨域)

function fake_click(obj) {
  var ev = document.createEvent('MouseEvents');
  ev.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
  obj.dispatchEvent(ev);
}

function export_raw(name, data) {
  var urlObject = window.URL || window.webkitURL || window;
  var export_blob = new Blob([data]);
  var save_link = document.createElementNS('http://www.w3.org/1999/xhtml', 'a')
  save_link.href = urlObject.createObjectURL(export_blob);
  save_link.download = name;
  fake_click(save_link);
}

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在Vue.js下载文件时,如果涉及到跨域问题,可以进行以下处理: 首先,在服务器端配置允许跨域请求的响应头。具体来说,需要在服务器端的响应中添加如下的头信息: ``` Access-Control-Allow-Origin: * Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token ``` 接着,可以通过使用axios库发送GET请求来实现文件下载。在发送下载请求时,需要在请求头中设置`responseType`为`blob`,该选项指定响应的数据类型为二进制数据。具体代码如下: ```javascript import axios from 'axios'; export function downloadFile() { axios({ method: 'GET', url: '下载文件的地址', responseType: 'blob' }) .then(response => { const url = window.URL.createObjectURL(new Blob([response.data])); const link = document.createElement('a'); link.href = url; link.setAttribute('download', '文件名'); document.body.appendChild(link); link.click(); }) .catch(error => { console.error('下载文件出错:', error); }); } ``` 在该代码中,通过axios发送GET请求并设置`responseType`为`blob`,将服务端返回的文件数据转换成二进制数据。然后创建一个`<a>`元素,将Blob数据作为URL创建链接,并设置`download`属性为要下载文件名。最后将链接添加到文档中,并触发点击链接的操作以下载文件。 需要注意的是,在Vue.js中需要安装axios库,可以使用以下命令进行安装: ``` npm install axios --save ``` 以上就是在Vue.js下载文件跨域的解决方案。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值