为什么 chrome 会为 canvas.toDataURL 引发安全异常答案

【问题标题】：Why would chrome raise security exception for canvas.toDataURL为什么 chrome 会为 canvas.toDataURL 引发安全异常
【发布时间】：2012-05-18 04:51:43
【问题描述】：

谁能帮我理解为什么当我从本地文件系统加载此页面时，chrome 可能会引发安全异常？ Opera 和 Firefox 没有问题，根据我的阅读，origin-clean 标志应该仍然是正确的。

<html>
<head>
<title>Canvas Test</title>
<script type="text/javascript">

    var canvas = document.createElement("canvas");
    canvas.setAttribute("width", 100);
    canvas.setAttribute("height", 100);

    var myImage = new Image();
    myImage.src = "gradient-1.png";

    function draw(){  
        document.body.appendChild(canvas);
        var ctx = canvas.getContext("2d");  
        ctx.drawImage(myImage, 0, 0, 100, 100);
        data = canvas.toDataURL("image/png");
        // Chrome says Uncaught Error: SECURITY_ERR: Dom Exception 18
    }

</script>
</head>

<body onload="draw()">
</body>
</html>

【问题讨论】：

见this question。
感谢@jholster，内容丰富。我最关心的是我正在开发的 phonegap android 应用程序。你知道同样的问题是否适用吗？
抱歉，不知道，但可以假设这是 Chrome 的一项功能，而不是 webkit。
@pguardiario - 你有同样的信息吗，我遇到了同样的问题
你不是在服务器上运行它吗？它只是一个客户端 .html 文件？如果是这种情况，则需要满足几个标准才能满足 CORS 政策。我的猜测，我可能完全错了，是你不满足端口要求，看到它不是监听特定端口的服务器......如果我错了，请纠正我......或者如果你有解决方案看到它8年了……

标签： javascript html dom google-chrome canvas

【解决方案1】：

我最好的猜测是您直接从浏览器中的文件系统加载 html 文件。当我开始使用画布而不是通过本地 Web 服务器运行我的代码时，我看到了同样的问题。试试看，否则很可能是文件损坏，因为您的代码是正确的。

【讨论】：