尝试访问对象中的 svg 时 chrome 出错答案

【问题标题】：Error on chrome when trying to access svg in object尝试访问对象中的 svg 时 chrome 出错
【发布时间】：2015-10-20 15:35:31
【问题描述】：

我没有太多的编码经验，我正在尝试让用户对嵌入在元素中的 SVG 进行一些控制。我找到了 ariutta svgpanzoom.js 库，但是当我尝试用它做一个小测试时，我在 chrome 中出现了一个安全错误（一切都适用于 Firefox 和 Safari）

这是我的基本代码

  
<!DOCTYPE html>
<html>
<head>
	<title>SVG test</title>
	<meta charset="utf-8">
	<script src="http://ariutta.github.io/svg-pan-zoom/dist/svg-pan-zoom.js"></script>
</head>
<body>
	<p><h1>Test SVG in object tag</h1></p>
	<br>
	<object id="mySVG" type="image/svg+xml" data="../Tests/simpleSVG.svg" width="400" height="400" style="border: 1px solid red;"></object>
	
	<script>
      window.onload = function() {
        svgPanZoom("#mySVG", {
          zoomEnabled: true,
          controlIconsEnabled: true
        });
      };
    </script>

</body>
</html>

我在 Chrome 上遇到的错误是： Uncaught SecurityError: Failed to read the 'contentDocument' property from 'HTMLObjectElement': Blocked a frame with origin "null" from accessing a frame with origin "null". Protocols, domains, and ports must match.

有人知道我做错了什么吗？

提前谢谢...

【问题讨论】：

您使用本地服务器吗？或者您只是从文件夹中打开页面？由于 SVG 被视为另一个文档，Chrome 可能会阻止远程脚本 (svg-pan-zoom) 访问本地文档（在您的情况下为对象）。
没错：当我将文件放在本地服务器上时，Chrome 不会显示错误。谢谢你的回答笨蛋

标签： javascript html google-chrome svgpanzoom

【解决方案1】：

Bumbu 是对的：Chrome 阻止了远程脚本 (svg-pan-zoom) 对本地文档（在本例中为对象）的访问。

代码从本地服务器运行时运行良好。

【讨论】：