码迷,mamicode.com
首页 > 其他好文 > 详细

前端的非同源图片下载

时间:2019-09-02 13:59:46      阅读:163      评论:0      收藏:0      [点我收藏+]

标签:图片   java   否则   VID   name   服务   属性   time()   预览   

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

非同源使用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>

  

 

前端的非同源图片下载

标签:图片   java   否则   VID   name   服务   属性   time()   预览   

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

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!