无法在“ DOMWindow”上执行“ postMessage”：https://www.youtube.com！== http：// localhost：9000

这是我收到的错误消息：

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。

1. 我没问题。问题是什么？
2. 我该如何解决？

我认为这与目标来源有关https。我怀疑是因为您使用的是iFrame网址，http而不是https。尝试更改要嵌入为的文件的url https。

例如：

'//www.youtube.com/embed/' + id + '?showinfo=0&enablejsapi=1&origin=http://localhost:9000';

成为：

'https://www.youtube.com/embed/' + id + '?showinfo=0&enablejsapi=1&origin=http://localhost:9000';

只需在播放器"origin"的paramVars属性中将参数与您网站的URL 添加在一起，如下所示：

this.player = new window['YT'].Player('player', {
    videoId: this.mediaid,
    width:'100%',
    playerVars: { 'autoplay': 1, 'controls': 0,'autohide':1,'wmode':'opaque','origin':'http://localhost:8100' },
}

设置它似乎可以解决此问题：

  this$1.player = new YouTube.Player(this$1.elementId, {
    videoId: videoId,
    host: 'https://www.youtube.com',

您可以将JavaScript保存到本地文件中：

• https://www.youtube.com/player_api
• https://s.ytimg.com/yts/jsbin/www-widgetapi-vfluxKqfs/www-widgetapi.js

player_api将以下代码放入第一个文件中：

if(!window.YT)var YT={loading:0,loaded:0};if(!window.YTConfig)var YTConfig={host:"https://www.youtube.com"};YT.loading||(YT.loading=1,function(){var o=[];YT.ready=function(n){YT.loaded?n():o.push(n)},window.onYTReady=function(){YT.loaded=1;for(var n=0;n<o.length;n++)try{o[n]()}catch(i){}},YT.setConfig=function(o){for(var n in o)o.hasOwnProperty(n)&&(YTConfig[n]=o[n])}}());

进入第二个文件，找到代码： this.a.contentWindow.postMessage(a,b[c]);

并替换为：

if(this._skiped){
    this.a.contentWindow.postMessage(a,b[c]); 
}
this._skiped = true;

当然，您可以串联到一个文件中-效率更高。这不是一个完美的解决方案，但是可以！

我的资料来源：yt_api-concat

确保您从以下网址加载：

https://www.youtube.com/embed/HIbAz29L-FA?modestbranding=1&playsinline=0&showinfo=0&enablejsapi=1&origin=https%3A%2F%2Fintercoin.org&widgetid=1

注意“ origin”组件以及“ enablejsapi = 1”。来源必须与您的域相匹配，然后它将被列入白名单并可以使用。

尝试使用window.location.hrefurl以匹配窗口的原点。

我遇到了同样的错误。我的错误是该enablejsapi=1参数在iframesrc中不存在。

我认为错误的描述具有误导性，最初与播放器对象的错误使用有关。

在Slider中切换到新视频时，我遇到了同样的问题。

仅使用此处描述的player.destroy()功能时，问题就消失了。

我遇到了同样的问题，原来是因为我正在运行Chrome扩展“ HTTPS Everywhere”。禁用扩展解决了我的问题。

当“在某些站点或应用程序上播放”时，此确切的错误与Youtube的内容阻止有关。更具体地说，是WMG（华纳音乐集团）。

但是，该错误消息确实表明问题是存在一个https iframe导入到http站点的问题，在这种情况下并非如此。

删除DNS预取将解决此问题。

如果您使用的是WordPress，请将此行添加到主题的functions.php中

remove_action( 'wp_head', 'wp_resource_hints', 2 );

您可以将iframe更改为这样，并将原点添加为当前网站。它解决了我的浏览器中的错误。

<iframe class="test-testimonials-youtube-group"  type="text/html" width="100%" height="100%"
  src="http://www.youtube.com/embed/HiIsKeXN7qg?enablejsapi=1&origin=http://localhost:8000"
  frameborder="0">
</div>

参考：https : //developers.google.com/youtube/iframe_api_reference#Loading_a_Video_Player

可能存在以下任何一种情况，但是所有这些都导致DOM在被javascript访问之前未加载。

因此，在实际调用JS代码之前，您需要确保以下几点：*确保在调用任何javascript之前已加载容器*请确保将目标URL加载到必须包含的任何容器中

我遇到了类似的问题，但是当我试图在首页的onLoad之前导致我的Javascript运行良好时，这会导致错误消息。我已经解决了，只需等待整个页面加载，然后调用所需的函数即可。

您可以简单地通过在页面加载后添加超时函数来执行此操作，然后调用onload事件，例如：

window.onload = new function（）{setTimeout（function（）{//一些onload事件}，10）; }

这样可以确保触发onLoad后，您尝试执行的操作能够很好地执行。

当未在调用中指定targetOrigin时，也会收到此消息window.postMessage()。

在此示例中，我们将消息发布到第一个iFrame并*用作目标，这应允许与任何targetOrigin进行通信。

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

在我看来，至少这似乎是一种无害的“未就绪”条件，API会重试直到成功。

我得到了其中的两个到九个（在最坏的情况下是测试用的2009 FossilBook，其中有20个通过蜂窝热点打开的标签）....但随后视频正常运行。一旦运行了我基于postMessage的对seekTo的调用就可以正常工作，就没有测试其他对象。

在某些情况下（如一位评论者所述），这可能是由于您在DOM之类的DOM中移动播放器而引起的，例如append等等。

你可以试试 ：

document.getElementById('your_id_iframe').contentWindow.postMessage('your_message', 'your_domain_iframe')

我也遇到了同样的问题，然后我访问了官方的Youtube Iframe Api，发现了这一点：

用户的浏览器必须支持HTML5 postMessage功能。大多数现代浏览器都支持postMessage

并四处寻找官方页面也面临此问题。只需访问官方的Youtube Iframe Api并查看控制台日志。我的Chrome版本是79.0.3945.88。

我的是：

<youtube-player
  [videoId]="'paxSz8UblDs'"
  [playerVars]="playerVars"
  [width]="291"
  [height]="194">
</youtube-player>

我只是删除了与playerVars的一行，并且在控制台上正常运行而没有错误。