Failed to execute 'postMessage' on 'DOMWindow'

[Demy]

Embedding video to the page causes this error in the console: Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('https://www.youtube.com') does not match the recipient window's origin (*host name*)

You can even see this error in the console on the demo page of the plugin.

[TitanFighter]

@Demy , Turn off AdBlock. Does not work any more. :confused:

[kanapka94]

I have the same error and think that this answer can be the answer to the problem. But we can't set host url. Maybe it should be props?

[aglio]

I have same issue. But I gave up fixing this problem. This error seems to be caused by YouTube IFrame Player API (YIPA). I got a same error when I tried this YIPA sample code. Therefore, I think that this error can not be fixed at present. FYI, https://github.com/videojs/videojs-youtube/issues/67

[TheJadeEmperor]

@Demy , Turn off AdBlock

Literally the dumbest comment made in Github. Turning off adblock does ABSOLUTELY NOTHING. Knowing that, I turned off Adblock anyways, and confirmed that it did ABSOLUTELY nothing. This is a place for developers, not dickheads, so get a life and get the f**k out of here.

[TitanFighter]

@TheJadeEmperor for your information, I had the same problem and before I posted it I checked multiply times that turning off AdBlock solved issue, but later, for some reason the issue came back.

This is a place for developers, not dickheads

Fully agree

so get a life

Already done

and get the f**k out of here.

I will choose myself where I would like to be. When I need anyone's advice I will ask for that somewhere else, because This is a place for developers, not dickheads

[TitanFighter]

Can anyone check the next:

    <youtube
      ref="youtube"
      ...
      :player-vars="playerVars"
    />

    playerVars: {
      ...
      origin: window.location.origin // or http(S)://your.domain.com
    }

Taken from here.

[michaelfeinbier]

Adding the origin: window.location.origin to the playerVars as suggested by @TitanFighter worked for me (tested in Chrome 71). Thanks!

[renetik]

I think this can be fixed like this in source of vue-youtube:

https://www.youtube.com/embed/HIbAz29L-FA?modestbranding=1&playsinline=0&showinfo=0&enablejsapi=1&origin=https%3A%2F%2Fintercoin.org&widgetid=1

Note the "origin" component, as well as "enablejsapi=1". The origin must match what your domain is, and then it will be whitelisted and work.

[anteriovieira]

close from https://github.com/anteriovieira/vue-youtube/pull/34

[jjangga0214]

@anteriovieira Unfortunately, still not solved. (version 1.3.5)

Failed to execute ‘postMessage’ on ‘DOMWindow’: 
The target origin provided (‘https://www.youtube.com’) does not match 
the recipient window’s origin (‘http://localhost:8080’).

[ghost]

@jjangga0214 does the error persist on a server (as opposed to your local dev environment)?

[Erutan409]

@kms-rscholz It does in my case. The server I'm developing is SSL, too.

[ghost]

@Erutan409 jup, thought it was solved in our production build, but the error still occurs for us too: https://new.kms-team.com/en

[ghost]

@anteriovieira Might be worth reopening this issue until a fix can be found!

[bjcooper]

@anteriovieira ,this is still happening for me on 1.4.0 as well, unfortunately. Both locally in development and on a production server with SSL.

[zmts]

I use native youtube iframe and it works for me

<iframe
        v-if="isYoutubeLink"
        frameborder="0"
        width="100%"
        :height="playerHeight"
        :src="`https://www.youtube.com/embed/${videoId}`"
        allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
        allowfullscreen>
</iframe>