Google Chrome SVG数据URI

时间:2014-06-19 10:41:30

标签: javascript google-chrome dom svg

我在Google Chrome上遇到以下代码问题(它在Firefox中运行)

    <!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
        <title>Test load jsp</title>
    </head>
    <body>        
        <object id="alphasvg"></object>    
    </body>
    <script src="http://code.jquery.com/jquery-2.1.1.js"></script>
    <script>
        var svg = "<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' id='svgid'><circle cx='40' cy='40' r='24' style='stroke:#006600; fill:#00cc00'/></svg>";
        var encodedString = btoa(svg);
        var svgdataencoded = 'data:image/svg+xml;base64,' + encodedString;
        $('#alphasvg').attr('data', svgdataencoded);

        var a = document.getElementById("alphasvg");        
        a.addEventListener("load", function() {
            var svg = a.contentDocument.getElementById("svgid");
            console.log(svg);
        }, false);

    </script>
</html>

Google Chrome会输出以下错误

  

Uncaught SecurityError:无法读取'contentDocument'属性   来自'HTMLObjectElement':阻止具有原点的帧   “http://server.mydomain.com:8080”访问具有原点“null”的帧。该   请求访问的帧具有协议“http”,帧是   access具有“数据”协议。协议必须匹配。

您有解决此错误的方法吗?

由于

0 个答案:

没有答案