2

ユーザーがSvgでデザインを作成できるWebベースのアプリケーションに取り組んでいます。クライアント側でsvgデザインをpng画像ファイルに変換したい。キャンバスを使用する解決策を見つけました。これはFirefoxではうまく機能しますが、クロムではセキュリティエラーが発生します。

以下のコードを確認してください:-

 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");

セキュリティエラーを生成します。

どんな助けでも大歓迎です。

4

1 に答える 1

0

これはこの質問に関連していると思います。SVG はどのサーバーから発信されていますか? アプリケーションの送信元とは異なる場合 (サブドメインが重要であることを忘れないでください)、元のサーバーに目的の http ヘッダーを追加できます。

于 2013-10-11T06:46:01.153 に答える