这是我得到的错误信息:
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。
我不明白这个问题。有什么问题吗? 我该怎么解决呢?
当前回答
我得到了同样的错误。我的错误是enablejsapi=1参数在iframe src中不存在。
其他回答
这一错误与Youtube在“在某些网站或应用程序上播放”时屏蔽内容有关。更确切地说，是WMG(华纳音乐集团)。
然而，错误消息确实表明，将https iframe导入到http站点是问题所在，在这种情况下并不是这样。
设置这个似乎可以解决这个问题:
this$1.player = new YouTube.Player(this$1.elementId, {
videoId: videoId,
host: 'https://www.youtube.com',
这帮助了我(Vue.js)
在vue-youtube上找到
mounted() {
window.YTConfig = {
host: 'https://www.youtube.com/iframe_api'
}
const host = this.nocookie ? 'https://www.youtube-nocookie.com' : 'https://www.youtube.com'
this.player = player(this.$el, {
host,
width: this.width,
height: this.height,
videoId: this.videoId,
playerVars: this.playerVars
})
...
}
更新: 像这样神奇地工作:
...
youtube(
video-id="your_video_code_here"
nocookie
)
...
data() {
return {
playerVars: {
origin: window.location.href,
},
};
},
可能有以下任何一种情况，但它们都导致DOM在被javascript访问之前没有加载。
所以在真正调用JS代码之前，你必须确保以下几点: *确保在任何javascript调用之前容器已经加载 *确保目标URL被加载到任何容器中
我遇到了类似的问题，但在我的本地，当我试图让我的Javascript在主页onLoad之前运行良好，导致错误消息。我已经通过简单地等待整个页面加载，然后调用所需的函数来修复它。
你可以简单地通过添加一个超时函数当页面已经加载并调用你的onload事件来做到这一点:
窗口。Onload =新函数(){ setTimeout(函数(){ //一些onload事件 }, 10); ｝
这将确保你正在尝试的东西将在onLoad触发后很好地执行。
只需要在播放器的paramVars属性中添加参数“origin”和你网站的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'
},
}
