How To Prevent Website From Being Loaded in Iframe

How To Prevent Website From Being Loaded in Iframe

by
Reading Time: 10 minutes
959 Views

Inside this article we will see the concept i.e How To Prevent Website From Being Loaded in Iframe. Article contains the classified information i.e Protect Your Website From Its Embedded Content With iFrames.

To prevent a website from being loaded in an iframe, you can use the X-Frame-Options header in the HTTP response. This header tells the browser whether or not to allow the page to be loaded in an iframe.

Read More: How to Create a Password Strength Validator in PHP Tutorial

Let’s get started.

How to Prevent Web Page from Being Loaded in iFrame

To prevent a website from being loaded in an iframe, you can use the X-Frame-Options header or the Content Security Policy (CSP)

There are three values that can be used with the X-Frame-Options header:

  1. DENY: This value instructs the browser to never allow the page to be loaded in an iframe, regardless of the site attempting to load it.
  2. SAMEORIGIN: This value instructs the browser to only allow the page to be loaded in an iframe if the site attempting to load it is the same as the site that the page is hosted on.
  3. ALLOW-FROM uri: This value instructs the browser to only allow the page to be loaded in an iframe if the site attempting to load it matches the specified URI.

Multiple Methods To Prevent Website Being Loaded in an Iframe

From here, you can use either any of the method to block your website from being loaded in an iframe.

  • Using meta tag
  • Configuring Apache
  • Configuring nginx
  • Configuring IIS
  • Configuring .htaccess

Using meta tag

You can also prevent a website from being loaded in an iframe using the <meta> tag in the HTML code of your website. Here’s how to implement it:

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

This code will prevent your website from being loaded in an iframe altogether. If you only want to allow your website to be loaded in an iframe on the same domain, use the following code:

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

This will allow your website to be loaded in an iframe only if it’s on the same domain.

Read More: Step by Step To Build Your Own Chrome Extension Tutorial

It’s important to note that using the <meta> tag to prevent your website from being loaded in an iframe is less secure than using the X-Frame-Options header or the Content Security Policy (CSP) because it can be easily bypassed by an attacker. Therefore, it’s recommended to use the X-Frame-Options header or the CSP instead, if possible.

Configuring Apache

To prevent a website from being loaded in an iframe using Apache, you can use the X-Frame-Options header. Here’s how to configure Apache to send the X-Frame-Options header:

  1. Open your website’s .htaccess file or Apache configuration file.
  2. Add the following code to your configuration file:
Header always append X-Frame-Options "DENY"

This will prevent your website from being loaded in an iframe altogether. If you only want to allow your website to be loaded in an iframe on the same domain, use the following code:

Header always append X-Frame-Options "SAMEORIGIN"

This will allow your website to be loaded in an iframe only if it’s on the same domain.

  1. Save your configuration file and restart Apache.

It’s important to note that this method requires server-side access to implement. If you don’t have server-side access, you can use the methods mentioned earlier, such as using the Content Security Policy (CSP) or the <meta> tag in the HTML code of your website. However, using the X-Frame-Options header is considered more secure and is recommended.

Configuring nginx

To prevent a website from being loaded in an iframe using Nginx, you can use the X-Frame-Options header. Here’s how to configure Nginx to send the X-Frame-Options header:

  1. Open your website’s Nginx configuration file.
  2. Add the following code inside the server block:
add_header X-Frame-Options "DENY";

This will prevent your website from being loaded in an iframe altogether. If you only want to allow your website to be loaded in an iframe on the same domain, use the following code:

add_header X-Frame-Options "SAMEORIGIN";

This will allow your website to be loaded in an iframe only if it’s on the same domain.

  1. Save your configuration file and reload Nginx.

It’s important to note that this method requires server-side access to implement. If you don’t have server-side access, you can use the methods mentioned earlier, such as using the Content Security Policy (CSP) or the <meta> tag in the HTML code of your website. However, using the X-Frame-Options header is considered more secure and is recommended.

Read More: How To Disable Right Click and F12 Key Using JavaScript

Configuring IIS

To prevent a website from being loaded in an iframe using IIS (Internet Information Services), you can use the X-Frame-Options header. Here’s how to configure IIS to send the X-Frame-Options header:

  1. Open the IIS Manager.
  2. Select your website in the left-hand pane and click on the “HTTP Response Headers” icon in the middle pane.
  3. Click on the “Add…” button in the right-hand pane to add a new response header.
  4. In the “Name” field, enter “X-Frame-Options“.
  5. In the “Value” field, enter one of the following values:
  • To prevent your website from being loaded in an iframe altogether, enter “DENY“.
  • To allow your website to be loaded in an iframe only if it’s on the same domain, enter “SAMEORIGIN“.
  1. Click “OK” to save the new response header.
  2. Restart IIS for the changes to take effect.

Example

<system.webServer>
  ...
  ...
  <httpProtocol>
    <customHeaders>
      <add name="X-Frame-Options" value="SAMEORIGIN" />
    </customHeaders>
  </httpProtocol>
  ...
  ...
</system.webServer>

It’s important to note that this method requires server-side access to implement. If you don’t have server-side access, you can use the methods mentioned earlier, such as using the Content Security Policy (CSP) or the <meta> tag in the HTML code of your website. However, using the X-Frame-Options header is considered more secure and is recommended.

Configuring .htaccess

To prevent a website from being loaded in an iframe using .htaccess file in Apache, you can use the X-Frame-Options header. Here’s how to configure your .htaccess file to send the X-Frame-Options header:

  1. Open your website’s .htaccess file.
  2. Add the following code at the top of the file:
Header always set X-Frame-Options "DENY"

This will prevent your website from being loaded in an iframe altogether. If you only want to allow your website to be loaded in an iframe on the same domain, use the following code:

Header always set X-Frame-Options "SAMEORIGIN"

This will allow your website to be loaded in an iframe only if it’s on the same domain.

  1. Save your .htaccess file.

It’s important to note that this method requires server-side access to implement. If you don’t have server-side access, you can use the methods mentioned earlier, such as using the Content Security Policy (CSP) or the <meta> tag in the HTML code of your website. However, using the X-Frame-Options header is considered more secure and is recommended.

Read More: Do You Know Types of Programming Errors of PHP?

We hope this article helped you to learn How To Prevent Website From Being Loaded in Iframe in a very detailed way.

If you liked this article, then please subscribe to our YouTube Channel for PHP & it’s framework, WordPress, Node Js video tutorials. You can also find us on Twitter and Facebook.