how to block website from loading in iframe?

Asked 7/11, 2013 at 17:51 Answered 19/7 at 19:53

Solved javascript jquery html iframe youtube

Recently i tried to load youtube website in an iframe, but i checked that it's not worked. i used this simple code.

<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<iframe width="1000px" height="700px" src="http://www.youtube.com" ></iframe>
</body>
</html>

i want to know , why my webpage can't load youtube website in iframe..
what code i use to load the youtube website in my webpage.
how i use same techniq in my website, so no one can add my website in iframe.

Pye answered 7/11, 2013 at 17:51 Comment(0)

This answer was written in 2013 and documents a DEPRECATED header. See other answers for a modern equivalent.

For browsers of 2013, a X-Frame-Options HTTP header needs to be used. It can be implemented through web server configuration settings.

You can view the X-Frame-Options in Header as in the image below,

Reference: https://www.keycdn.com/blog/x-frame-options/

If your browser does not support it, then you will have NO clickjacking defense in place and can use HTTP Header Field X-Frame-Options,

  <meta http-equiv="X-Frame-Options" content="deny">

There are three possible values for X-Frame-Options:

DENY - The page cannot be displayed in a frame, regardless of the site attempting to do so.

SAMEORIGIN - The page can only be displayed in a frame on the same origin as the page itself.

ALLOW-FROM uri - The page can only be displayed in a frame on the specified origin.

Hyperostosis answered 7/11, 2013 at 17:57 Comment(3)

so there's no way to use the webpage in iframe, because i saw some site and software.. who use embed youtube webpage , so if they can use youtube type bigwebsite.. so may be there is hole in this techniq.. or is this perfect.. ? – Pye 7/11, 2013 at 18:4

Note: As of April 2016 this meta tag no longer works in most browsers. RFC 7034 recommends this meta tag be ignored: tools.ietf.org/html/rfc7034#section-4 . Most major browsers removed support accordingly. See bugs.webkit.org/show_bug.cgi?id=156625 – Henigman 7/9, 2016 at 16:0

To clarify, the HTML meta tag is indeed useless now (see developer.mozilla.org/en-US/docs/Web/HTTP/Headers/…), but the X-Frame-Options HTTP header still applies and is the correct way to do it. – Langford 19/12, 2020 at 10:12

As of April 2016 the accepted answer by Krish R no longer works. Most browsers now ignore the meta tag as recommended by RFC 7034.

The correct way to implement this header is to have it sent with the document by the server. See the mozilla documentation on X-Frame-Options for details.

Henigman answered 7/9, 2016 at 16:9 Comment(0)

as of 2024-07-19, youtube still uses the x-frame-options. however, that header is now also obsolete. the latest recommendation is to use the content-security-policy header. specifically, you should add a "frame-ancestors 'self';" directive to the policy. the simplest example would be this http response header:

content-security-policy: frame-ancestors 'self';

source: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy

Kelpie answered 19/7 at 19:53 Comment(0)

Recommended topics

Hot tags