Vimeo video works locally but not on live website: Uncaught Security Error: origin error with iframe

3
votes

I am having a hard time figuring this one out. I have two videos on my website that I host at vimeo. With the embded code they provide, one video will display and playback and the other will playback locally but not once I upload it to bluehost.

The console reads: Uncaught SecurityError: Failed to read the 'contentDocument' property from 'HTMLIFrameElement': Blocked a frame with origin "http://www.example.org" from accessing a frame with origin "http://example.org". Protocols, domains, and ports must match.

and it cites jquery.min.js.

I've found a few suggestions about how to work around this with document.domain but to no avail. Any help would be much appreciated. Thank you for your time

1
javascriptjqueryiframevideovimeo
Can include html , js at Question ? - guest271314

1 Answers

0
votes

From https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy

http://store.company.com/dir2/other.html : Success
http://store.company.com/dir/inner/another.html : Success
https://store.company.com/secure.html : Failure - Different protocol
http://store.company.com:81/dir/etc.html : Failure - Different port
http://news.company.com/dir/other.html : Failure - Different host

The one you want to look at is the bottom line - 'Failure - different host':

Your explination has http://example.com and http://www.example.com, which can actually be considered different hosts. So I would try to match up both with www or non-www.

If this does not work, the other solution is to use HTTP access control (CORS), but it may be much more complicated than you are willing to deal with. https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS