Embedding youtube video "Refused to display document because display forbidden by X-Frame-Options"

Question

I'm trying to embed a youtube video on to my page once the user gives the link to the video.

<iframe width=\'560\' height=\'315\' src='http://www.youtube.com/watch?v=<video id>&amp;output=embed' frameborder=\'0\' allowfullscreen></iframe>

But when I try to add this I get this error. After inspecting the page in chrome, I see this error in the console tab

"Refused to display document because of the display is forbidden by X-Frame-Options"

I'm not able to see the video even in IE and Firefox also

I even tried adding the

 header('X-Frame-Options:Allow-From http://www.youtube.com'); 
 header('X-Frame-Options:GOFORIT);
 &output=embed to the url

After reading certain solutions in other posts.

But I still get the same error.

I also see that the youtube has the method of object embedding to show the video, but already youtube has made that as old method of embedding the video. So I want to use the new iframe method of embedding the video on to my page.

Problem is seen in

• Firefox 11
• Chrome 18.0
• IE 8

Anybody faced this problem?

Solution 1

When you copy a video link off YouTube: "https://www.youtube.com/watch?v=Fva3fgKmu3o"

• Replace 'watch' with 'embed'

• Remove '?v='

Final Example: "https://www.youtube.com/embed/Fva3fgKmu3o"

Solution 2

Replace the keyword watch?v= with embed and change the live URL something like this:-

$url_string="https://www.youtube.com/watch?v=H1pTkatn6sI";
$url= str_replace('watch?v=','embed/', $url_string);

And then embed it in the iframe

<iframe id="player" type="text/html" width="640" height="390" src="{{ $url }}" frameborder="0"></iframe>

Comments

[ElvisP]

the best answer, I searched for days for a solution for dynamic embed with iframe and that solved it first.