防止其他网站通过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文件中:

<system.webServer>
  ...

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

  ...
</system.webServer>

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

三、写在最后

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

  • 支付宝二维码 支付宝
  • 微信二维码 微信

本文地址: /block-iframe.html

版权声明: 本文为原创文章,版权归 逐梦个人博客 所有,欢迎分享本文,转载请保留出处!

相关文章