vue2 使用html2canvas.js图片跨域问题怎么解决

344 阅读1分钟

vue2 使用html2canvas.js这是个问题贴

在使用html2canvas将页面生成图片时,从后端取的图片在画图时会出现跨域的报错,从网上查的是需要设置 useCORS: true, img标签加上crossOrigin="anonymous",后端设置Access-Control-Allow-Origin: *。按照这个设置之后图片显示不出来报跨域 img img 报错的图片也是相应不出来 img 部分代码如下

             <img
              :src="informationList.headImgUrlNew"
              width="95%"
              alt=""
              crossOrigin="anonymous"
            />
      html2canvas(this.$refs.imageForm, {
        // 获取宽高
        width: this.$refs.imageForm.clientWidth,
        height: this.$refs.imageForm.clientHeight,
        // 图片跨域
        useCORS: true,
      }).then((canvas) => {
        const dataURL = canvas.toDataURL("image/png");
      });

请问怎么解决一下