前端图片下载跨域问题

image.png

// 调用方式
// 参数一： src
// 参数二： 图片名称，可选
downloadImage(src, name) {
  // 生成一个 a 标签
  const a = document.createElement("a");
  a.download = name || "图片";
  a.style.display = "none";
  const image = new Image();
  image.src = src + "?v=" + Math.random();
  image.crossOrigin = "*";
  const vm = this;
  image.onload = () => {
    const base64 = vm.getBase64Images(image);
    a.href = base64;
    document.body.appendChild(a);
    a.click();
    document.body.removeChild(a);
  };
},

getBase64Images(image) {
  const canvas = document.createElement("canvas");
  canvas.width = image.width;
  canvas.height = image.height;
  const context = canvas.getContext("2d");
  context.drawImage(image, 0, 0, image.width, image.height);
  const url = canvas.toDataURL("image/png", 0);
  return url;
},