javascript SecurityError：canvas.toDataURL 中的操作不安全
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/29133612/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
SecurityError: The operation is insecure in canvas.toDataURL
提问by Javier Mu?oz
I've tried to resolve the next error but without success.
我试图解决下一个错误，但没有成功。
I have the following jQuery and HTML5 code:
我有以下 jQuery 和 HTML5 代码：
<script language="javascript" type="text/javascript">
function doExportMap() {
map.once('postcompose', function(event) {
var canvas = event.context.canvas;
var exportBMPElement = document.createElement('a');
exportBMPElement.download = 'Mapa.bmp';
exportBMPElement.href = canvas.toDataURL('image/bmp');
document.body.appendChild(exportBMPElement);
exportBMPElement.click();
document.body.removeChild(exportBMPElement);
});
map.renderSync();
}
It was working perfectly way, but now, I'm getting the following error:
它以完美的方式工作，但现在，我收到以下错误：
SecurityError: The operation is insecure.
exportBMPElement.href = canvas.toDataURL('image/bmp');
What is wrong? Any ideas?
怎么了？有任何想法吗？
The funny is that I'm not loading the image from an external source. The image is from localhost
有趣的是，我没有从外部来源加载图像。图像来自本地主机
回答by Shawn Lehner
It would be helpful if you could post the code you are using to modify the canvas before attempting to export it. With the information you provided, my guess would be that you are writing content from an external source to your canvas. This is why it was working before and is no longer working. I assume your initial tests used a resource from the same origin.
如果您可以在尝试导出画布之前发布用于修改画布的代码，那将会很有帮助。根据您提供的信息，我的猜测是您正在将外部来源的内容写入画布。这就是为什么它以前可以工作而不再工作的原因。我假设您的初始测试使用了来自同一来源的资源。
Explanation
解释
The same security sandbox exists with the canvas as does with any data requests being made from your code. Anytime you load content from another domain/origin it will trigger the canvas to set the origin-cleanflag to false. This means the browser will prevent you from exporting data that has been loaded into the canvas. There are quite a few posts pertaining to this type of issue on StackOverflow:
与从您的代码发出的任何数据请求一样，画布中存在相同的安全沙箱。每当您从另一个域/来源加载内容时，它都会触发画布将origin-clean标志设置为 false。这意味着浏览器将阻止您导出已加载到画布中的数据。StackOverflow 上有很多关于此类问题的帖子：
