Блог

Главная - Вопросы по программированию - URI данных SVG в Google Chrome

URI данных SVG в Google Chrome

#javascript #google-chrome #dom #svg

#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 выдает следующую ошибку

Неперехваченная ошибка безопасности: не удалось прочитать свойство ‘contentDocument’ из ‘HTMLObjectElement’: заблокирован фрейм с источником «http://server.mydomain.com:8080 » из-за доступа к фрейму с исходным значением «null». Фрейм, запрашивающий доступ, имеет протокол «http», фрейм, к которому осуществляется доступ, имеет протокол «data». Протоколы должны совпадать.

Есть ли у вас какое-либо решение для устранения этой ошибки?

Спасибо

Комментарии:

1. У вас есть SVG перед его загрузкой, поэтому, если вы хотите изменить его, вы всегда можете изменить исходные данные и перезагрузить их в качестве атрибута данных. Это так, или напишите патч для Chrome и отправьте его, я полагаю.

2. Это пример кода для отладки сообщения об ошибке из Chrome. SVG загружается асинхронно в мой рабочий код. В любом случае Chrome жалуется на протокол между http: и данными: