这是我得到的错误信息:
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。
我不明白这个问题。有什么问题吗? 我该怎么解决呢?
当前回答
这帮助了我(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,
},
};
},
其他回答
你可以试试:
document.getElementById('your_id_iframe').contentWindow.postMessage('your_message', 'your_domain_iframe')
这一错误与Youtube在“在某些网站或应用程序上播放”时屏蔽内容有关。更确切地说，是WMG(华纳音乐集团)。
然而，错误消息确实表明，将https iframe导入到http站点是问题所在，在这种情况下并不是这样。
当您在调用window.postMessage()时没有指定targetOrigin时，也会收到此消息。
在本例中，我们向第一个iFrame发送消息，并使用*作为目标，这应该允许与任何targetOrigin通信。
window.frames[0].postMessage({
message : "Hi there",
command :"hi-there-command",
data : "Some Data"
}, '*')
您可以将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;
当然，你也可以将其串联成一个文件——这样会更有效率。 这不是一个完美的解决方案，但它是有效的!
My Source: yt_api-concat
至少在我的实例中，这似乎是一个无害的“未准备好”条件，API会不断重试，直到成功为止。
我在任何地方都能找到2到9个(在我最糟糕的测试中，通过蜂窝热点打开了20个标签的2009年的《化石书》)....但之后视频功能正常。一旦它运行我的postmessage基于调用seekTo肯定工作，还没有测试其他。
