Javascript HTML5画布访问控制允许源错误

当我尝试从画布元素获取数据时，出现以下javascript错误：

错误：canvas.toDataURL（）不受支持。[异常…”操作不安全。“代码：“18”nsresult:“0x80530012（SecurityError）”

画布是从来自不同域的图像绘制的，但我使用代理将以下两行添加到图像响应标头：

访问控制允许来源：*

访问控制允许凭据：true

我错过了什么

谢谢，

---

Ted

要发出正确的CORS请求，必须将图像设置为“匿名”。它来自Mozilla开发者网络

var img = new Image,
    canvas = document.createElement("canvas"),
    ctx = canvas.getContext("2d"),
    src = "http://example.com/image"; // insert image url here

img.crossOrigin = "Anonymous";

img.onload = function() {
    canvas.width = img.width;
    canvas.height = img.height;
    ctx.drawImage( img, 0, 0 );
    localStorage.setItem( "savedImageData", canvas.toDataURL("image/png") );
}
img.src = src;
// make sure the load event fires for cached images too
if ( img.complete || img.complete === undefined ) {
    img.src = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==";
    img.src = src;
}

---

浏览器支持不包括任何已知版本的IE和未发布版本的Safari。Firefox和Chrome已经有多年的支持了。

Uhh如何准确地使用您的代理。除非您使用跨域iframe消息/后端服务，否则它将失败。我正在使用桌面上的Charles（）作为代理来处理图像响应标题（添加访问控制允许原点线）。这仅适用于开发人员。如果可行，我将请求更改图像服务器标头，以添加access control allow Original lines。
我的理解是，如果图像响应标头具有access control allow Original lines，则我的javascript可以编辑画布。我终于找到了它。缺少的部分是设置将图像的crossOrigin属性转换为“匿名”。此处的更多信息：请回答您自己的问题，并将自己标记为已接受的答案，以便以后查找此内容的人更容易找到它。