防止网页被嵌入框架的代码

为了防止其他网站使用框架(Frame),将你的网页嵌入它的网页中。可以将下面一段简单的Javascript代码放入网页源码的头部,别人就无法使用你的网页了:

<script>
  if(window!=top) //判断当前的window对象是否top对象
  {
    //如果不是,将top对象的网址自动导向被嵌入网页的网址
    top.location.href = window.location.href; 
  }
</script>

但这段代码使用后,任何人都无法再把你的网页嵌入框架了,包括你自己。
那有没有一种方法,使得我的网页只能只能嵌入我自己的框架,而不是别人的框架呢?

表面上看,这个问题很简单。只要做一个判断:当前框架和顶层框架的域名是否相同,如果答案是否,就做一个URL重定向。

if(top.location.hostname !=   window.location.hostname){
  top.location.href = window.location.href;
}

但是出乎意料的是,这样写是错误的,根本无法运行。

假定 top.location.hostname 是 www.111.com,而 window.location.hostname 是 www.222.com。也就是说,111.com222.com 嵌入了它的网页。这时比较 top.location.hostname != window.location.hostname 会有什么结果呢?

浏览器会提示代码出错。

因为它们跨域(cross-domain)了,浏览器的安全策略不允许 222.com 的网页操作 111.com 的网页,反之亦然。IE 把这种错误叫做“没有权限”。进一步说,浏览器甚至不允许你查看 top.location.hostname,跨域情况下,一看到这个对象,就直接报错。

那么,代码应该如何修改?

事实上,这提示我们,只要查看 top.location.hostname 是否报错就可以了。如果报错,表明存在跨域,就对 top 对象进行 URL 重定向;如果不报错,表明不存在跨域(或者未使用框架),就不采取操作。

try{
  top.location.hostname;
}catch(e){
  top.location.href = window.location.href;
}

这样写已经正确了,在 IE 和 Firefox 中可以正确运行。但是,Chrome 浏览器会出现错误,不知为何,在跨域情况下,Chrome 对 top.location.hostname 不报错!

没办法,只能为了 Chrome,再加一段代码。

try{
  top.location.hostname;
  if(top.location.hostname != window.location.hostname){
      top.location.href = window.location.href;
  }
}catch(e){
  top.location.href = window.location.href;
}

好了,现在除了本地域名,其它域名一律无法将你的网页嵌入框架。
<br />
来源:防止网页被嵌入框架的代码

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,476评论 25 708
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,981评论 19 139
  • 搜索引擎就像一个无限大的智能仓库,他可以存储一切不管有用无用东西,当你说你饿了的时候,他会告诉你哪个货架上放着米饭...
    产品二三事阅读 848评论 0 2
  • 累了一天,终于等到了那个时刻,所谓的归心似箭也许就是这个感觉…… 休息了,却睡不着,那些一起走过...
    素笺_淡墨阅读 200评论 0 1
  • 今晚儿子又忘记拿作业了,老公接他回来,他趴在门口小心翼翼的跟我说:“妈,我保证这是最后一次,”我没有说话,因为我很...
    六年级三班陈枫妈妈阅读 228评论 0 2