前端的非同源图片下载

由于再日常开发中，公司往往会有一个图片服务器。在要求前端实现图片下载时往往会有非同源的问题。

非同源使用download属性默认会预览而不是下载。

由于图片服务器往往是允许跨域的，所以我们在这里用ajax get请求的方式，获取图片blob文件，再由

window.URL.createObjectURL

(专门用来将blob或者file读取成一个url的可被img,video,audio 识别显示出来的url)

 1 function downloadImg(src,name){
 2         var x=new XMLHttpRequest();　　　　　　　//禁止浏览器缓存；否则会报跨域的错误
 3         x.open("GET", src+‘?t=‘+new Date().getTime(), true);
 4         x.responseType = ‘blob‘;
 5         x.onload=function(e){
 6             var url = window.URL.createObjectURL(x.response)
 7             var a = document.createElement(‘a‘);
 8             a.href = url
 9             a.download = name
10             a.click()
11         }
12         x.send();
13     }

<a href="javascript:;" id="download" onclick=‘downloadImg(url,name)‘>下载</a>

原文地址：https://www.cnblogs.com/yihuite-zch/p/11445733.html