YouTube iFrame Player API failed to execute postMessage on DOMWindow
<p>I am trying to load youtube into my web page using <strong><code>YouTube iFrame Player API</code></strong>, and getting following error while loading:</p>

<pre><code>Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('https://www.youtube.com') does not match the recipient window's origin ('https://developer-sandbox.com').
</code></pre>

<p>both origin and target are <code>https</code>, there are few <strong>SO</strong> post which resolves the issue by keeping origin &amp; target url to https. In this case both are same.</p>

<p>Following is the JS code I am used to load the player dynamically:</p>

<pre><code>showVideoPreview: function(youtube_id){
        var meThis = this;
        var player = new YT.Player('shoppable-video-container', {
            height  : '315',
            width   : '560',
            videoId : youtube_id,
            events  : {
                'onReady'       : meThis.onPlayerReady,
                'onStateChange' : meThis.onPlayerStateChange
            }
        });
    }
</code></pre>

<p><a href="https://i.stack.imgur.com/FUauF.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/FUauF.png" alt="youtube iframe api video loading error view"></a></p>