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);
}
}
laravel+vue+vuetify(下载图片到本地)
原文：https://www.cnblogs.com/xiaofeilin/p/12966249.html
