无法在“DOMWindow”上执行“postMessage”：提供的目标源（“<URL>”）与收件人窗口的源（“<URL>”）不匹配

Question

我收到此错误： Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('<URL>') does not match the recipient window's origin ('<URL>').

我的页面按我希望的方式运行（我没有注意到任何不受欢迎的行为），但我从不喜欢忽略控制台中的错误，尤其是在我什至不了解根本原因的情况下。

我的问题不是重复的，因为我已经研究了所有这些问题，但没有一个答案有效：

• 无法在“DOMWindow”上执行“postMessage”：https://www.youtube.com !== http://localhost:9000
• 无法在“DOMWindow”上执行“postMessage”：提供的目标源与收件人窗口的源不匹配（“null”）
• Youtube API - 无法在“DOMWindow”上执行“postMessage”
• YouTube API 和跨源请求
• YouTube iFrame Player API 无法在 DOMWindow 上执行 postMessage
• 无法在“DOMWindow”上执行“postMessage”：目标/来源不匹配 http 与 https

我已经在用了https。

我已经尝试设置playerVars为{origin: window.location.origin}.

我已经尝试过设置host。

我已经尝试过更改 iframe 的可见性。

等等。

var playerVars = {origin: window.location.origin};///sf/answers/3536277321/
window.onYouTubeIframeAPIReady = function () {
    for (var i = 0; i < youtube.length; i++) {
        var youtubeLazyEl = youtube[i];
        var videoId = youtubeLazyEl.dataset.v;
        players[videoId] = new YT.Player(videoId, {
            videoId: videoId,
            //host: 'https://www.youtube.com', ///sf/answers/3354011951/
            //playerVars: playerVars,
        });
    }
};

想法？

Answer 1

由于您似乎正在使用延迟加载，请尝试删除 iframes HTML 属性loading="lazy"- 这为我解决了问题。