这是我得到的错误信息:

Failed to execute 'postMessage' on 'DOMWindow': The target origin provided
('https://www.youtube.com') does not match the recipient window's origin 
('http://localhost:9000').

我见过其他类似的问题,其中目标源是http://www.youtube.com,收件人源是https://www.youtube.com,但没有一个像我的问题一样,目标是https://www.youtube.com,源是http://localhost:9000。

我不明白这个问题。有什么问题吗? 我该怎么解决呢?


当前回答

至少在我的实例中,这似乎是一个无害的“未准备好”条件,API会不断重试,直到成功为止。

我在任何地方都能找到2到9个(在我最糟糕的测试中,通过蜂窝热点打开了20个标签的2009年的《化石书》)....但之后视频功能正常。一旦它运行我的postmessage基于调用seekTo肯定工作,还没有测试其他。

其他回答

我也有同样的问题,原来是因为我有Chrome扩展“HTTPS无处不在”运行。禁用扩展解决了我的问题。

我在尝试嵌入一个条纹定价表时得到了类似的错误消息:

通过自定义WordPress短代码通过PHP添加嵌入代码 或者使用JavaScript动态地将代码追加到页面(即使使用setTimeout()延迟来确保DOM被加载也不起作用)。

我可以在我的WordPress网站上解决这个问题,方法是在块编辑器中使用纯html代码将代码添加到WordPress页面本身。

我想我们可以定制YT的sendMessage。球员

playerOptions.playerVars.origin = window.location.origin or your domain.
this.youtubePlayer = new YT.Player(element,playerOptions);
this.youtubePlayer.sendMessage = function (a) {
   a.id = this.id, a.channel = "widget", a = JSON.stringify(a);
   var url = new URL(this.h.src), origin = url.searchParams.get("origin");
   if (origin && this.h.contentWindow) {
       this.h.contentWindow.postMessage(a, origin)
   }
}

我在我的项目中使用了这个函数来求解。

当您在调用window.postMessage()时没有指定targetOrigin时,也会收到此消息。

在本例中,我们向第一个iFrame发送消息,并使用*作为目标,这应该允许与任何targetOrigin通信。

window.frames[0].postMessage({
                    message : "Hi there",
                    command :"hi-there-command",
                    data : "Some Data"
                }, '*')

这一错误与Youtube在“在某些网站或应用程序上播放”时屏蔽内容有关。更确切地说,是WMG(华纳音乐集团)。

然而,错误消息确实表明,将https iframe导入到http站点是问题所在,在这种情况下并不是这样。