防止其他网站通过iframe嵌套自己站点的两种方式-逐梦个人博客

在运营网站过程中，我们经常会通过iframe嵌入一些第三方的内容或服务，比如广告、地图、视频等等。然而，如果其他网站也想要嵌套我们的站点，就可能产生一些安全风险和隐私问题。为了保护我们的网站安全，防止被其他网站通过iframe嵌套，本文将介绍两种有效的方法。

一、通过js来控制

通过js我们可以防止被其它网站恶意嵌套，判断依据是根据当前的Location对象是否和顶层的Location对象一致，如果不一致则说明网站被嵌套，将当前Location对象赋值给顶层Location强制跳转至我们自己的网站，使用代码如下：

if (top.location !== self.location) {
    top.location = self.location;
}

如果使用上述方式来实现防嵌套，建议将上述代码保存为单独的js文件，并在head标签的前面通过script标签引用，如果网站存在公用头部，可直接添加至公用头部的head标签内。

二、通过服务端配置

1、nginx配置

我们也可以通过nginx配置来实现网站防嵌套，主要是利用X-Frame-Options这个响应头，X-Frame-Options是一种安全头(security header)允许网站控制其页面是否可以在其他网站的框架或内嵌框架中显示。它可以设置以下三个值：

DENY：不允许页面在任何框架或内嵌框架中显示，无论尝试显示该页面的网站是什么，即便是在相同域名的页面中嵌套也不允许。配置示例：add_header X-Frame-Options DENY;

SAMEORIGIN：允许页面在同一域中的框架或内嵌框架中显示，但不允许在不同域中显示。配置示例：add_header X-Frame-Options SAMEORIGIN;

ALLOW-FROM uri：允许页面在特定来源指定的框架或内嵌框架中显示，但也被认为是不安全的，因此已经被废弃不建议使用。配置示例：add_header X-Frame-Options 'ALLOW-FROM https://xxx.xxxxxx.com'; 注意单引号一定要写。

2、apache配置

apache的配置方式和nginx类似，根据需要将上面的示例代码加入到site的配置中：

Header set X-Frame-Options "DENY"
Header set X-Frame-Options "SAMEORIGIN"
Header set X-Frame-Options "ALLOW-FROM https://xxx.xxxxxx.com"

3、IIS配置

配置IIS发送X-Frame-Option响应头，添加下面的配置到Web.config文件中：

&lt;system.webServer>
  ...

  &lt;httpProtocol>
    &lt;customHeaders>
      &lt;add name="X-Frame-Options" value="SAMEORIGIN" />
    &lt;/customHeaders>
  &lt;/httpProtocol>

  ...
&lt;/system.webServer>

注意：使用<meta>标签来设置X-Frame-Options是无效的！例如<meta http-equiv="X-Frame-Options" content="deny">没有任何效果。不要这样用！

三、写在最后

虽然上述两种方式都能实现网站放嵌套，但是使用js的话会稍微麻烦一点，如果有多个站点需要每个站点都添加，而且如果没有公用的头部代码，我们需要为每一个页面添加代码，而使用服务端配置的方式我们可以在全局配置，不需要改动任何网站代码，而且还支持自定义屏蔽行为，这里更推荐大家使用服务端配置的方式。

赏

推荐订阅源

逐梦个人博客