为什么 chrome 会引发 canvas.toDataURL 的安全异常
有人可以帮助我理解为什么当我从本地文件系统加载此页面时 chrome 可能会引发安全异常吗？ Opera 和 Firefox 没有问题，从我读到的内容来看，origin-clean 标志应该仍然是 true。
<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>
Can someone help me understand why chrome might raise a security exception when I load this page from the local filesystem? Opera and Firefox don't have a problem and from what I've read the origin-clean flag should still be true.
<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>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
我最好的猜测是您直接从浏览器的文件系统加载 html 文件。当我开始使用画布而不是通过本地网络服务器运行代码时，我看到了同样的问题。尝试一下，否则它很可能是一个损坏的文件，因为您的代码是正确的。
My best guess would be you are loading the html file directly from the file system in your browser. I saw the same issue when i started playing with with canvas and not running my code through my local web server. Give that a try, otherwise it's most likely a corrupt file because your code is correct.