html2canvas在前端生成图片跨域

import html2Canvas from 'html2canvas'

import download from "@/utils/download"; //download.js
export default{
 install (Vue, options) {
   Vue.prototype.getPdf = function (id,callback) {
    //浏览器滚动条置顶不然会出现空白
     window.pageYoffset = 0;
     document.documentElement.scrollTop = 0;
     document.body.scrollTop = 0;
     
     html2Canvas(document.querySelector(id), {
       // allowTaint: true,
       useCORS:true,//允许跨域
       scrollX: -8//修正x轴偏移
     }).then(function (canvas) {
      
       let contentWidth = canvas.width
       let contentHeight = canvas.height
       let pageHeight = contentWidth / 592.28 * 841.89
       let leftHeight = contentHeight
       let position = 0
       let imgWidth = 595.28
       let imgHeight = 592.28 / contentWidth * contentHeight
   	//2、给要生成canvas的DOM中包含的每一个<img>标签添加crossorigin="anonymous"属性；不然会报错（此节点document.querySelector(id)）
       let pageData = canvas.toDataURL('image/jpeg', 1.0)

       download(pageData, title + ".png", "image/png");

1、添加useCORS:true属性；

2、给要生成canvas的DOM中包含的每一个标签添加crossorigin="anonymous"属性；

3、确保你的图片CDN服务器支持CORS访问，也就是会返回Access-Control-Allow-Origin等响应头；