前端的非同源圖片下載

由於再日常開發中，公司往往會有一個圖片服務器。在要求前端實現圖片下載時往往會有非同源的問題。

非同源使用download屬性默認會預覽而不是下載。

由於圖片服務器往往是允許跨域的，所以我們在這里用ajax get請求的方式，獲取圖片blob文件，再由

window.URL.createObjectURL

(專門用來將blob或者file讀取成一個url的可被img,video,audio 識別顯示出來的url)

function downloadImg(src,name){
        var x=new XMLHttpRequest();
　　　　　　　//禁止瀏覽器緩存；否則會報跨域的錯誤
        x.open("GET", src+'?t='+new Date().getTime(), true);
        x.responseType = 'blob';
        x.onload=function(e){
            var url = window.URL.createObjectURL(x.response)
            var a = document.createElement('a');
            a.href = url
            a.download = name
            a.click()
        }
        x.send();
    }

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