无法导出污染的画布

Question

我想将画布保存为img。我有这个功能：

function save() {
    document.getElementById("canvasimg").style.border = "2px solid";
    var dataURL = canvas.toDataURL();
    document.getElementById("canvasimg").src = dataURL;
    document.getElementById("canvasimg").style.display = "inline";
}

它给我错误：

未捕获到的SecurityError：无法在“ HTMLCanvasElement”上执行“ toDataURL”：可能无法导出污染的画布。

我该怎么办？

Answer 1

出于安全原因，您的本地驱动器被声明为“其他域”，并将污染画布。

（这是因为您最敏感的信息可能在本地驱动器上！）。

在测试时，请尝试以下解决方法：

• 将所有与页面相关的文件（.html，.jpg，.js，.css等）放在桌面上（而不是子文件夹中）。

• 将您的图像发布到支持跨域共享的站点（例如dropbox.com）。确保将图像放在Dropbox的公用文件夹中，并在下载图像时设置交叉原点标记（var img = new Image（）; img.crossOrigin =“ anonymous” …）

• 在开发计算机上安装Web服务器（IIS和PHP Web服务器都有免费版本，可以在本地计算机上很好地工作）。