svg - svg 图像的画布安全错误

Question

我要做的是在画布上绘制 svg 图像，然后创建这个画布的 PNG 图像。这是我所做的一个例子：

        var canvas = document.getElementById('mycanvas');
        var ctx = canvas.getContext('2d');
        var img = new Image();
        img.onload  = function () {
                ctx.drawImage(this, 0, 0, this.width, this.height);
                var url = canvas.toDataURL("image/png");
        }
        img.crossorigin = "Anonymous"; //not sure this affects anything...
        img.src="some image url"

当我设置 png/jpeg 图像的来源时，它可以正常工作，但是 src 是 svg 图像，我在调用“ canvas.toDataURL("image/png") ”时收到“ Uncaught Error: SECURITY_ERR: DOM Exception 18 ”。我不明白有什么区别？

当我采用内联 svg 并将其渲染到画布内，然后尝试创建 png 图像时，也会发生同样的情况。我现在没有代码 - 如果需要，我稍后会添加它。

Answer 1

我找到了解决方案。显然画布有另一个功能来绘制svgs“drawSvg”所以我使用它并且它有效。