I am trying to feed my Django page with some resource I am getting from somewhere else.
Inside the feed, I have YouTube videos with URL like: https://www.youtube.com/watch?v=A6XUVjK9W4o
Once I added this into my page, the video does not show up, saying:
Refused to display 'https://www.youtube.com/watch?v=A6XUVjK9W4o' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.
Then I said, well, what if I change watch to embed. Then YouTube player shows up, but no video, saying:
How can I get this to work?
I am showing it in HTML like this:
<iframe width="420" height="315"
src="{{vid.yt_url}}">
</iframe>
I googled almost for an hour, but no sign of success. I tried to append &output=embed - nada...
This question is related to
html
django
video
youtube
youtube-api
The answer is
You must ensure the URL contains embed rather watch as the /embed endpoint allows outside requests, whereas the /watch endpoint does not.
<iframe width="420" height="315" src="https://www.youtube.com/embed/A6XUVjK9W4o" frameborder="0" allowfullscreen></iframe>
You only need to copy <iframe> from the YouTube Embed section (click on SHARE below the video and then EMBED and copy the entire iframe).
The YouTube URL in src must have and use the embed endpoint instead of watch, so for instance let’s say you want to embed this YouTube video: https://www.youtube.com/watch?v=P6N9782MzFQ (browser's URL).
You should use the embed endpoint, so the URL now should be something like https://www.youtube.com/embed/P6N9782MzFQ. Use this value as the URL in the src attribute inside the iframe tag in your HTML code, for example:
<iframe width="853" height="480" src="https://www.youtube.com/embed/P6N9782MzFQ" frameborder="0" allowfullscreen ng-show="showvideo"></iframe>
So just replace https://www.youtube.com/watch?v= with https://www.youtube.com/embed/ and of course check for your video's ID. In this sample, my video ID is P6N9782MzFQ.
If embed no longer works for you, try with /v instead:
<iframe width="420" height="315" src="https://www.youtube.com/v/A6XUVjK9W4o" frameborder="0" allowfullscreen></iframe>
Along with the embed, I also had to install the Google Cast extension in my browser.
<iframe width="1280" height="720" src="https://www.youtube.com/embed/4u856utdR94" frameborder="0" allowfullscreen></iframe>
Source: Stackoverflow.com