可复制粘贴使用
downloadEWM(url, name) {
// 获取图片地址
const tag = document.createElement("a");
// 此属性的值就是下载时图片的名称,注意,名称中不能有半角点,否则下载时后缀名会错误
tag.setAttribute("download", name.replace(/\./g, "。"));
const image = new Image();
// 设置 image 的 url, 添加时间戳,防止浏览器缓存图片
image.src = url + "?time=" + new Date().getTime();
//重要,设置 crossOrigin 属性,否则图片跨域会报错
image.setAttribute("crossOrigin", "Anonymous");
// 图片未加载完成时操作会报错
image.onload = () => {
tag.href = getImageDataURL(image);
tag.click();
};
function getImageDataURL(image) {
// 创建画布
const canvas = document.createElement("canvas");
canvas.width = image.width;
canvas.height = image.height;
const ctx = canvas.getContext("2d");
// 以图片为背景剪裁画布
ctx.drawImage(image, 0, 0, image.width, image.height);
// 获取图片后缀名
const extension = image.src
.substring(image.src.lastIndexOf(".") + 1)
.toLowerCase();
// 某些图片 url 可能没有后缀名,默认是 png
return canvas.toDataURL("image/" + extension, 1);
}
}