防止别人嵌套自己的网站

绝地灬酷狼 2022-06-05 07:26 233阅读 0赞

X-Frame-Options [HTTP][] 响应头是用来给浏览器指示允许一个页面可否在 [ `<frame>`][_frame], [ `<iframe>`][_iframe] 或者 [ `<object>`][_object] 中展现的标记。网站可以使用此功能，来确保自己网站的内容没有被嵌到别人的网站中去，也从而避免了点击劫持 (clickjacking) 的攻击。

## 使用 X-Frame-Options[Edit][] ##

X-Frame-Options 有三个值:

`DENY`

表示该页面不允许在 frame 中展示，即便是在相同域名的页面中嵌套也不允许。

`SAMEORIGIN`

表示该页面可以在相同域名页面的 frame 中展示。

`ALLOW-FROM uri`

表示该页面可以在指定来源的 frame 中展示。

换一句话说，如果设置为 `DENY，不光在别人的网站 frame 嵌入时会无法加载，在同域名页面中同样会无法加载。另一方面，如果设置为``SAMEORIGIN`，那么页面就可以在同域名页面的 frame 中嵌套。

### 配置 Apache ###

配置 Apache 在所有页面上发送 X-Frame-Options 响应头，需要把下面这行添加到 'site' 的配置中:

Header always append X-Frame-Options SAMEORIGIN

### 配置 nginx ###

配置 nginx 发送 X-Frame-Options 响应头，把下面这行添加到 'http', 'server' 或者 'location' 的配置中:

add_header X-Frame-Options SAMEORIGIN;

### 配置 IIS ###

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

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

## 结果[Edit][Edit 1] ##

在 Firefox 尝试加载 frame 的内容时，如果 X-Frame-Options 响应头设置为禁止访问了，那么 Firefox 会用 about:blank 展现到 frame 中。也许从某种方面来讲的话，展示为错误消息会更好一点。

## 浏览器兼容性[Edit][Edit 2] ##

*  Desktop
 *  Mobile

<table> 
 <tbody> 
  <tr> 
   <th>特性</th> 
   <th>Chrome</th> 
   <th>Firefox (Gecko)</th> 
   <th>Internet Explorer</th> 
   <th>Opera</th> 
   <th>Safari</th> 
  </tr> 
  <tr> 
   <td>基础支持</td> 
   <td>4.1.249.1042</td> 
   <td><a title="Released on undefined." href="https://developer.mozilla.org/en-US/Firefox/Releases/NaN" rel="nofollow">3.6.9</a> (1.9.2.9)</td> 
   <td>8.0</td> 
   <td>10.5</td> 
   <td>4.0</td> 
  </tr> 
  <tr> 
   <td>ALLOW-FROM 支持</td> 
   <td><span style="color:rgb(255,0,0)">未实现</span></td> 
   <td><a title="Released on 2013-01-08." href="https://developer.mozilla.org/en-US/Firefox/Releases/18" rel="nofollow">18.0</a> (18.0) <a title="FIXED: Implement Allow-From syntax for X-Frame-Options" href="https://bugzilla.mozilla.org/show_bug.cgi?id=690168" rel="nofollow"> bug&nbsp;690168</a></td> 
   <td>8.0?</td> 
   <td><span title="Compatibility unknown; please update this." style="color:rgb(255,153,0)">?</span></td> 
   <td><span style="color:rgb(255,0,0)">未实现</span> <a title="" href="https://bugs.webkit.org/show_bug.cgi?id=94836" rel="nofollow"> WebKit bug 94836</a></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <th>特性</th> 
   <th>Android</th> 
   <th>Chrome Android 版</th> 
   <th>Firefox 移动版 (Gecko)</th> 
   <th>IE 移动版</th> 
   <th>Opera 移动版</th> 
   <th>Safari 移动版</th> 
  </tr> 
  <tr> 
   <td>基础支持</td> 
   <td><span title="Compatibility unknown; please update this." style="color:rgb(255,153,0)">?</span></td> 
   <td><span title="Compatibility unknown; please update this." style="color:rgb(255,153,0)">?</span></td> 
   <td><span title="Compatibility unknown; please update this." style="color:rgb(255,153,0)">?</span></td> 
   <td><span title="Compatibility unknown; please update this." style="color:rgb(255,153,0)">?</span></td> 
   <td><span title="Compatibility unknown; please update this." style="color:rgb(255,153,0)">?</span></td> 
   <td><span title="Compatibility unknown; please update this." style="color:rgb(255,153,0)"></span></td> 
  </tr> 
 </tbody> 
</table>

[HTTP]: https://developer.mozilla.org/en/HTTP
[_frame]: https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/frame
[_iframe]: https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/iframe
[_object]: https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/object
[Edit]: https://developer.mozilla.org/zh-CN/docs/Web/HTTP/X-Frame-Options$edit#使用_X-Frame-Options
[Edit 1]: https://developer.mozilla.org/zh-CN/docs/Web/HTTP/X-Frame-Options$edit#结果
[Edit 2]: https://developer.mozilla.org/zh-CN/docs/Web/HTTP/X-Frame-Options$edit#浏览器兼容性