canvas - Kinetic JS：toDataURL() 不适用于图像

Question

我已经定义了这个函数：

function viewCanvasImg() {
    //("stage" is a kineticjs stage class object)
    stage.toDataURL({ 
        callback: function(dataUrl) {
            document.getElementById('prova').src=dataUrl;
            window.open(dataUrl);
        }
    });
}

但是当我通过按钮调用它时它不起作用。使用形状和绘图都可以正常工作，但不能使用画布上的图像。

解决 了我注意到代码不仅仅在本地机器上工作，然后我把它放在我的网络服务器上，一切正常。

Answer 1

检查教程，看看它是否适合你：

http://www.html5canvastutorials.com/kineticjs/html5-canvas-stage-data-url-with-kineticjs/

您的代码看起来正确。如果它不起作用，您可能会在调用 window.open 之前收到 Javascript 错误。检查控制台，console.log是你的朋友。

此外，可能发生的事情stage未在您的函数中定义。因此，您可能需要通过该viewCanvasImg函数传递舞台对象。

更新

使用图像，toDataURL您必须注意同源策略。

阅读此处了解更多信息：为什么 canvas.toDataURL() 会引发安全异常？

http://en.wikipedia.org/wiki/Same-origin_policy

这是 KineticJS 在控制台中抛出的错误：

动力学警告：无法获取数据 URL。试图突破用户代理的安全策略。

Answer 2

在新窗口中打开数据图像 url 时，我遇到了类似的问题；本地不显示。

尝试在 Chrome 中右键单击 > 检查元素。