资源下载 - 从此开始!

下载我_精品源码软件教程资源网

您的位置:主页 > 网络编程 > 正文

【JS实现】同域可以但禁止异域网站用iframe嵌入网页

2018-10-12 18:28 来源:互联网 编辑:admin

网页禁止被iframe嵌入的方法,我想很多人都知道怎样用JS实现了,如果你还不知道,请看如下代码:

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

代码很简单,但是上述代码是无论任何网站都不能用iframe嵌入该网页,然而我们更希望自己的网站可以嵌入该网页,仅禁止其他网站嵌入即可。

要达到此效果,就要重新编写上面的JS代码了,修改后的代码如下:

<script type="text/javascript">
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;
}
</script>

使用此代码后,除了本地域名以外,其他域名一律无法将你的网页嵌入框架。

上述代码在IE、Firefox、Chrome浏览器测试通过!

完整范例

example.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>iframe引用网页范例</title>
</head>
<body>
iframe引用网页范例<br>
<iframe src="http://www.webkaka.com/tutorial/js/2018/011623/js-no-iframe.html" style="width:600px;height:350px;border:1px;"></iframe>
</body>
</html>

js-no-iframe.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>使用JS防止网页被Frame框架调用</title>
<script language="JavaScript">
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;
}
</script>
</head>
<body>
<b>这是被iframe引用的页面</b>
</body>
</html>

execcode getcode

网上有些文章说可以破解,让此JS代码失效,此方法不再生效,以致仍然可以用iframe嵌入网页,果真如此?请看《【轻易破解】使用JS防止网页被Frame框架调用?》。

使用X-Frame-Options防止网页被Frame

上面提到用JS防止网页被iframe嵌入,其实最好的方法是使用 X-Frame-Options 防止网页被Frame,使用 X-Frame-Options 可以轻松设置同域可以但禁止异域网站用iframe嵌入网页,可参考我此前写的文章《360安全提示“X-Frame-Options头未设置”的解决方法(IIS)》、《web.config 设置 X-Frame-Options 的方法【亲测有效】》。

上一篇:js和jquery给iframe src赋值的3种方法

下一篇:没有了

打赏一下,我们会为大家提供更多优质资源!

相关文章,95%的人会看!{有内幕、有真相...}

看过本文的人还看过

关闭

微信扫一扫

站长微信账号