通常我们可以使用a标签的download属性来下载文件，但是这个属性只在同源下有效。详见MDN文档，如果图片不是同源下载，浏览器会打开一个新的标签页显示图片，为了兼容以上两种情况，可以使用JS方式实现：//获取图像DataURLconstgetImageDataURL=(image)=>{constcanvas=document.createElement('canvas')canvas.width=image.widthcanvas.height=image.heightconstctx=canvas.getContext('2d')ctx.drawImage(image,0,0,image.width,image.height)常量扩展=image.src.substring(image.src.lastIndexOf('.')+1).toLocaleLowerCase()returncanvas.toDataURL('image/'+extension)}//执行下载//url-图片地址（必填）//name-图片名称（可选，如果没有上传，使用url文件名）exportconstdownloadImage=(url,name)=>{if(!url){return}consta=document.createElement('a');const文件名=名称||url.substring(url.lastIndexOf('/')+1)。toLocaleLowerCase()a.setAttribute('download',filename)constimage=document.createElement('img');image.setAttribute('crossOrigin','Anonymous')image.onload=()=>{a.href=getImageDataURL(image)a.点击（）}图像。来源=网址}
