在移动网站中嵌入 youtube 视频有效，但“域协议和端口必须匹配”错误正在干扰浏览器

Posted 2023-03-13

【中文标题】在移动网站中嵌入 youtube 视频有效，但“域协议和端口必须匹配”错误正在干扰浏览器

【英文标题】：Embedding a youtube video in a mobile site works, but 'Domains protocols and ports must match' error is jamming browser

【发布时间】：2013-01-11 07:32:02

【问题描述】：

我正在尝试通过 jQuery 注入以下代码，将 youtube 视频动态嵌入到移动网页中。

$("#tagetId").append("http://www.youtube.com/embed/oHg5SJYRHA0' frameborder='0'>");

我正在 chrome ios 上对此进行测试，视频确实可以正确渲染，但是网页的某些部分似乎认为视频没有渲染，并且每隔半秒左右我就会收到以下错误的新实例。

Unsafe javascript attempt to access frame with URL http://mydomain.html from frame with URL http://www.youtube.com/embed/oHg5SJYRHA0. Domains, protocols and ports must match.

这似乎真的阻塞了浏览器，并导致加载事件回调函数（i.d.“第一行代码”）一遍又一遍地触发。

$('iframe').load(function() //第一行代码 $(this).load(function() //第二行代码 ) );

有没有更好的方法来做到这一点。谁能解释我做错了什么？

【问题讨论】：

既然你用的是jQuery Mobile，你能做一个对话框吗？ jquerymobile.com/demos/1.2.0/docs/pages/dialog/index.html

【参考方案1】：

不知道你在做什么

$("#tagetId").append("http://www.youtube.com/embed/oHg5SJYRHA0' frameborder='0'>");

但这看起来像是附加了格式错误的 HTML。

也许您只是没有附加整个 iframe 标记？

【参考方案2】：

这解决了它：

<iframe scrolling='no' class='youtube-player' style='height:200px;width:100%' src='https://www.youtube.com/embed/oHg5SJYRHA0?html5=1' frameborder='0'></iframe>

【讨论】：

好老oHg5SJYRHA0！