在客戶端將Svg轉換為Png

Question

我正在基於Web的應用程序上工作，用戶可以在其中使用Svg創建設計。 我想在客戶端將svg設計轉換為png圖像文件。 我找到了使用畫布的解決方案，這在Firefox中效果很好，但是在chrome中會產生安全錯誤。

檢查下面的代碼謝謝：-

 var mainsvg=document.getElementById('svgforImg');                           
 var canvas=document.getElementById('canvas');                       
 var ctx = canvas.getContext("2d");
                        var data=mainsvg.innerHTML;
                        var DOMURL = self.URL || self.webkitURL || self;
                        var svg = new Blob([data], {
                                type: "image/svg+xml;charset=utf-8"
                        });
                        var url = DOMURL.createObjectURL(svg);
                        var img = new Image();
 img.onload = function() {
                               ctx.drawImage(img, 0, 0);
                                DOMURL.revokeObjectURL(url);                                  
                                var imageurl = canvas.toDataURL("image/png");
}

現在，我的變量imageurl包含“ base64 png”圖像。 這在Firefox中有效。 但是在鉻線

var imageurl = canvas.toDataURL("image/png");

產生安全性錯誤。

任何幫助將不勝感激。

Answer 1

我認為這與這個問題有關 。 SVG源自哪個服務器？ 如果它不同於您的應用程序來自的應用程序（請記住：子域很重要！），則可以在原始服務器中添加所需的http標頭。