防止网页被frameset iframe内嵌自动跳出框架 JS和HTTP header实现

php · 发表于 2016/12/3 15:44

JS禁止网站被iframe内嵌，自动跳出嵌套框架iframe，X-Frame-Options也可以阻止网页被iframe嵌套，但无法自动跳出嵌套帧。
防止网页被iframe的JS代码，兼容IE、Chrome、Firefox、Opera、Safari等所有浏览器。注：所谓的被iframe，是指通过iframe标签或者frameset标签将其他网页嵌套进一个网页中去，很有吸星大法的感觉。

<script>
(function(){
/*
* JS禁止网页被iframe或frameset嵌套检测到被嵌套时自动跳出框架
* 支持IE、Chrome、Firefox、Opera、Safari等所有浏览器
* 吴先成 www.wuxiancheng.cn www.51-n.com
* 将此段代码放置在<head></head>之间尽量作为第一段js代码可以节省渲染时间
*/
var isIframed = false;
try{
var topURL = window.top.location.href;
isIframed = topURL !== window.location.href;
}catch(e){
isIframed = true;
}finally{
if(isIframed){
try{
window.top.location.replace(window.location.href);
}catch(e){
}
}
}
})();
</script>

复制代码

对于多数情况以上代码已经够用了，但是仍然可能被阻止，尤其是现代浏览器，对于html5而言，iframe可以指定sandbox来屏蔽被嵌套页面中的脚本，另一方面，也可以通过其他手段使被嵌套页面的脚本失效，这时候就可以通过HTTP header的X-Frame-Options响应头信息。X-Frame-Options响应头的取值可以是DENY SAMEORIGIN ALLOW-FROM之一，分别代码禁止，允许相同域名，允许指定的URI，如果嵌套者的域名不匹配，被嵌套网页会显示成空白页（about:blank），反之则正常显示。通常如果不希望网站被其他网页嵌套，使用SAMEORIGIN即可。X-Frame-Optons响应头兼容性也不错，IE8+及Chrome、Firefox、Opera、Safari等现代浏览器都支持DENY和SAMEORIGIN，而ALLOW-FROM兼容性略差。
X-Frame-Options响应头，可以通过脚本代码发送，也可以通过服务器软件发送。
PHP代码发送X-Frame-Options示例

<?php
header('X-Frame-Options: SAMEORIGIN');
?>

复制代码

Apache服务器，可以修改配置项，在httpd.conf配置文件中添加

Header always append X-Frame-Options SAMEORIGIN

复制代码

Nginx服务器，可以在http/server/location配置段中添加

add_header X-Frame-Options SAMEORIGIN;

复制代码

如果被iframe嵌套的网页使用X-Frame-Options禁止了外部嵌套，可以在Google Chrome控制台看到红色显示的以下信息：
Refused to display 'https://www.wuxiancheng.cn/' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.

账号		自动登录	找回密码
密码			新建账号

防止网页被frameset iframe内嵌 自动跳出框架 JS和HTTP header实现

防止网页被frameset iframe内嵌自动跳出框架 JS和HTTP header实现