这是我得到的错误信息:
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。
我不明白这个问题。有什么问题吗? 我该怎么解决呢?
当前回答
当您在调用window.postMessage()时没有指定targetOrigin时，也会收到此消息。
在本例中，我们向第一个iFrame发送消息，并使用*作为目标，这应该允许与任何targetOrigin通信。
window.frames[0].postMessage({
message : "Hi there",
command :"hi-there-command",
data : "Some Data"
}, '*')
其他回答
你可以改变你的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
我的是:
<youtube-player
[videoId]="'paxSz8UblDs'"
[playerVars]="playerVars"
[width]="291"
[height]="194">
</youtube-player>
我只是用playerVars删除了这一行，它在主机上没有错误。
我想我们可以定制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)
}
}
我在我的项目中使用了这个函数来求解。
扩展上面@Hokascha的回答，对我来说也是惰性加载，被WordPress自动添加。这段代码将删除站点iframes上的所有延迟加载(添加到functions.php):
function disable_post_content_iframe_lazy_loading( $default, $tag_name, $context ) {
if ( 'iframe' === $tag_name ) {
return false;
}
return $default;
}
add_filter('wp_lazy_loading_enabled', 'disable_post_content_iframe_lazy_loading', 10, 3);
当您在调用window.postMessage()时没有指定targetOrigin时，也会收到此消息。
在本例中，我们向第一个iFrame发送消息，并使用*作为目标，这应该允许与任何targetOrigin通信。
window.frames[0].postMessage({
message : "Hi there",
command :"hi-there-command",
data : "Some Data"
}, '*')
