js跨域下载

跨域文件下载

同源下载(非跨域)

通过a标签下载

这个方法有缺陷,如果跨域资源,那么download属性将会失效,默认还是会打开新的浏览器标签页。

const a = document.createElement('a');
a.setAttribute('href',row.url); //设置下载文件的url地址
a.setAttribute('download' ,row.name );//用于设置下载文件的文件名
a.click();

跨域下载(需要服务器配置允许跨域)

遇到跨域资源可以通过XMLHttpRequest发起跨域请求,然后通过跨域请求回来的文件生成同源的url,然后再通过同源的url将文件保存到本地。

这个方法可以避免a标签download属性失效,从而打开新的的浏览器标签页。但是该方法还是需要服务器端设置为允许跨域请求才能成功。

var x=new XMLHttpRequest();       //禁止浏览器缓存;否则会报跨域的错误
x.open("GET", row.url, true);
x.responseType = 'blob';
x.onload=function(e){
        var url = window.URL.createObjectURL(x.response)  //生成同源url
        var a = document.createElement('a');
        a.href = url
        a.download = row.name
        a.click()
    }
x.send();	  
posted @   鸭梨的药丸哥  阅读(38)  评论(0编辑  收藏  举报  
相关博文:
阅读排行:
· 分享4款.NET开源、免费、实用的商城系统
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
· 上周热点回顾(2.24-3.2)
点击右上角即可分享
微信分享提示