Youtube iframe API无法发布消息

Question

有一段时间了,我写的一段javascript听某个页面上的youtube动作效果非常好.我正在使用Youtube的iframe js api:https://developers.google.com/youtube/iframe_api_reference.但是最近添加了一个内容,一个特定的YouTube视频,跟踪无法正常工作.事件根本不会发生.

在控制台中,我注意到此帖子消息错误: Unable to post message to http://youtube.com. Recipient has origin http://www.youtube.com.

所以我自己的代码没有任何帮助.关于stackoverflow的一些问题表明这是一个启动new YT.player太快的问题,所以我尝试了很多东西,例如在加载时加载yt js api文件window并且之后只应用api,但这似乎没有任何好处.

Answer 1

我知道这篇文章已有3年历史,但对于那些仍在寻找答案的人来说:

添加此脚本,一切正常:

<script src="https://www.youtube.com/iframe_api"></script>

我和jwplayer有同样的问题并用该脚本修复它.

Answer 2

我花了一个多小时,但答案就在我面前.它实际上非常自我解释:你不能使用youtube的js api来跟踪iframe视频www.我不知道为什么,它在文档中肯定没有这么说.

我测试了几次并确认,截至目前,使用源跟踪iframe www.youtube.com/embed/0GN2kpBoFs4将非常有效,而跟踪youtube.com/embed/0GN2kpBoFs4将抛出:

Unable to post message to http://youtube.com. Recipient has origin http://www.youtube.com.

令人困惑的部分当然是视频加载和播放都很好.它只是API无法正常工作.

小提琴 - http://jsfiddle.net/8tkgW/(在镀铬/山狮上测试过)

顺便说一句,在写这个答案时,我遇到了YouTube iframe API:如何控制已经在HTML中的iframe播放器？ - 注意这个家伙的小提琴.他编写了自己的youtube iframe实现(哇!).如果您将小提琴中的iframe源地址更改为没有www,它将起作用.这只意味着youtube写了坏js.坏坏了!

Answer 3

不要忘记将其添加到白名单中:

<!-- Add the whitelist plugin -->
<plugin name="cordova-plugin-whitelist" source="npm" spec="*"/>

<!-- White list https access to Youtube -->
<allow-navigation href="https://*youtube.com/*"/>