Question

我正在尝试使用以下代码嵌入YouTube视频：

<iframe width="425" height="319" frameborder="0" wmode="Opaque"allowfullscreen=""
      src="http://www.youtube.com/embed/8vJwFvFi4ZY?wmode=transparent">
</iframe>

虽然它工作正常，但它在控制台中出现了这个错误：

Chrome版本22.0.1229.94：


不安全的JavaScript尝试使用网址http://example.com/访问框架     来自带有网址http://www.youtube.com/embed/8vJwFvFi4ZY?wmode=transparent的框架。
    域，协议和端口必须匹配。


Firefox 17.0版：


错误：访问属性'toString'
的权限被拒绝

我搜索过，但我发现它可能是YouTube问题，他们应该解决它，

问题是：我该如何摆脱这个错误？（无论如何，甚至通过压制它。）

Answer 1

你不能阻止它，至少不是我知道的任何方式（我已经尝试了很多）。 iframe目标中有一个脚本试图访问您的文档，可能正在寻找可以调用以启用API的全局函数。

另一件事是即使使用自己的iframe API错误仍然存在：http://jsbin.com/izabed/1/edit

这没有任何害处，您的视频将正常工作。但是如果你在控制台中运行它，它看起来有点大胆。它们可能应该将此作为参数包含在内，起初我认为这是origin参数的概念，但它没有任何区别。

值得注意的是，他们自己的demo显示相同的错误（以及其他错误）。另外，如果您使用embed标记而不是iframe，则不会显示任何错误。

所以你可以做这样的事情来防止大多数桌面浏览器出错：

if(haveflash) {
    // use <embed>
} else {
    // use iframe
}

Answer 2

将讨论从评论转移到此答案。简而言之，问题是不允许跨域JS对象访问，在您的情况下，youtube.com上的脚本正在尝试对父页面执行。

如果您只想显示YouTube视频，则可以使用<embed>标记。

Answer 3

只需添加?html5=1即可防止此错误。（切换到HTML5播放器）

Answer 4

它是什么浏览器？当我尝试在此页面中使用JavaScript在Firefox中附加iframe时，不会出现错误/警告。

Answer 5

为什么在只能使用CSS时使用Javascript？它适用于every.single.time。您甚至可以将任何视频合并到响应滑块中。

或者只是访问：http://embedresponsively.com/

<style>
.embed-container 
{ 
position: relative; 
padding-bottom: 56.25%; 
height: 0; 
overflow: hidden; 
max-width: 100%; 
} 

.embed-container iframe, .embed-container object, .embed-container embed 
{ 
position: absolute; 
top: 0; 
left: 0; 
width: 100%; 
height: 100%; 
}
</style>

<div class='embed-container'>

<iframe src='https://www.youtube.com/watch?v=tntOCGkgt98' frameborder='0' allowfullscreen>
</iframe>
</div>

使用iframe嵌入Youtube视频会产生“不安全的JavaScript尝试......”

5 个答案: