Javascript DOMEException:未能执行'；toDataURL'；在'；HTMLCanvasElement'；：受污染的画布不得出口

重要提示：可以在本地主机上正常工作，但不能在实时服务器上正常工作。（戈达迪）

问题：

var data = canvasObj.toDataURL()  

  function wtd_load_bg_image( img_url ) 
  {    
    if( img_url )
    {
      var bg_img = new Image(); 
      bg_img.setAttribute('crossOrigin', '');
      bg_img.onload = function()
      {
        canvasObj.setBackgroundImage(bg_img.src, canvasObj.renderAll.bind(canvasObj), {
          originX: 'left',
          originY: 'top',
          left: 0,
          top: 0
        });
      };      
      bg_img.src = img_url;
    }      
  }

Wordpress插件在单击“预览”按钮时出现错误，但在本地主机上没有出现相同的错误

错误：

var data = canvasObj.toDataURL()  

  function wtd_load_bg_image( img_url ) 
  {    
    if( img_url )
    {
      var bg_img = new Image(); 
      bg_img.setAttribute('crossOrigin', '');
      bg_img.onload = function()
      {
        canvasObj.setBackgroundImage(bg_img.src, canvasObj.renderAll.bind(canvasObj), {
          originX: 'left',
          originY: 'top',
          left: 0,
          top: 0
        });
      };      
      bg_img.src = img_url;
    }      
  }

未捕获的DomeException:未能在上执行“toDataURL” “HtmlCanvaElement”：可能无法导出受污染的画布

错误行：

var data = canvasObj.toDataURL()  

  function wtd_load_bg_image( img_url ) 
  {    
    if( img_url )
    {
      var bg_img = new Image(); 
      bg_img.setAttribute('crossOrigin', '');
      bg_img.onload = function()
      {
        canvasObj.setBackgroundImage(bg_img.src, canvasObj.renderAll.bind(canvasObj), {
          originX: 'left',
          originY: 'top',
          left: 0,
          top: 0
        });
      };      
      bg_img.src = img_url;
    }      
  }

canvasObj的初始化：

canvasObj= new fabric.Canvas('wtd_background_image');

将图像设置为canvasObj:

var data = canvasObj.toDataURL()  

  function wtd_load_bg_image( img_url ) 
  {    
    if( img_url )
    {
      var bg_img = new Image(); 
      bg_img.setAttribute('crossOrigin', '');
      bg_img.onload = function()
      {
        canvasObj.setBackgroundImage(bg_img.src, canvasObj.renderAll.bind(canvasObj), {
          originX: 'left',
          originY: 'top',
          left: 0,
          top: 0
        });
      };      
      bg_img.src = img_url;
    }      
  }

我在网上找到的解决方案不起作用：

var data = canvasObj.toDataURL()  

  function wtd_load_bg_image( img_url ) 
  {    
    if( img_url )
    {
      var bg_img = new Image(); 
      bg_img.setAttribute('crossOrigin', '');
      bg_img.onload = function()
      {
        canvasObj.setBackgroundImage(bg_img.src, canvasObj.renderAll.bind(canvasObj), {
          originX: 'left',
          originY: 'top',
          left: 0,
          top: 0
        });
      };      
      bg_img.src = img_url;
    }      
  }

修改htaccess文件（不起作用！）

更改Fabric.js版本（部分工作）

---

将Fabric.js版本从1.2.0更改为其他版本，此错误会消失，但会出现新的错误。所以我不喜欢

升级到1.7.9，并解决其他问题。

setBackgroundImage（bg_img.src…

将在内部创建一个新的图像元素，不带

crossOrigin

属性，除非您告诉它：

setBackgroundImage（bg_img.src…top:0，crossOrigin:'anonymous'}）

；但这意味着您将加载图像两次，因此不要使用此

bg_img

，或者，您可以执行

bg_img.onload=function（）{canvas.setBackgroundImage（new fabric.image（bg_img，{