1

HTML5 元素 getImageData() 出现问题 我在网站上使用 wScratchPad 作为临时工具，并使用 wScratchPad 中的百分比函数来确定何时删除覆盖。它在 IE9、Safari 和 Chrome 上运行良好。但它会在 Firefox 中引发安全错误。

我在 Chrome 和 IE9 中也遇到了同样的问题，但通过将 JS、图像和 HTML 移动到同一台服务器来修复它。

我知道如果 JS 和 Canvas Image 的域不在同一个域上，它会引发错误，所以我检查了 image 和 js 的 document.domain。它看起来像 'document.domain = domain.com' 的 JS，并且图像具有 document.domain = www.domain.com。

这可能是问题吗？如果是这样，我该如何解决？我已经看到了一种覆盖浏览器以获取用户确认脚本的警报的方法，但鉴于这是一个高知名度的网站，这是不可能的。

在 wScratchPad 中导致错误的代码下方：

scratchPercentage: function($this)
{
    var hits = 0;
    var imageData = $this.ctx.getImageData(0,0,$this.canvas.width,$this.canvas.height)

    for(var i=0, ii=imageData.data.length; i<ii; i=i+4)
    {
        if(imageData.data[i] == 0 && imageData.data[i+1] == 0 && imageData.data[i+2] == 0 && imageData.data[i+3] == 0) hits++;
    }

    return (hits / $this.pixels) * 100;
},
4

1 回答 1

0

是的，您的问题是页面和图像不是同源的。

修复它的方法是从 www.domain.com 加载页面，就像图像一样，或者让您的服务器随图像一起发送适当的 CORS 标头。

我很惊讶您说它可以在其他浏览器中使用。您是否可能从 www.domain.com 加载了那些页面？

于 2012-12-04T05:54:19.060 回答