downloadByBlob(url,name) {
let image = new Image()
image.setAttribute('crossOrigin', 'anonymous') //處理跨域 可以在瀏覽器安裝cors插件
image.src = url
image.onload = () => {
let canvas = document.createElement('canvas')
canvas.width = image.width
canvas.height = image.height
let ctx = canvas.getContext('2d')
ctx.drawImage(image, 0, 0, image.width, image.height)
canvas.toBlob((blob) => { //圖片的blob對象
let url = URL.createObjectURL(blob) //將blob對象轉為url
this.download(url,name)
// 用完釋放URL對象
URL.revokeObjectURL(url)
})
}
},
download(href, name) {
let eleLink = document.createElement('a')
eleLink.download = name //下載的文件名
eleLink.href = href //文件流
eleLink.click() //單擊下載
eleLink.remove() //移除
},
//remoteSelected選中的圖片的數據(后台返回的數據),循環下載
async writeImage(remoteSelected){
this.loading = true;
for(var key in remoteSelected) {
let url = remoteSelected[key]['url']
let name = remoteSelected[key]['name']
await this.downloadByBlob(url,name);
}
}