web前端安全性——iframe安全问题
1、概念
iframe安全问题可称作界面劫持，像点击劫持、拖放劫持、触屏劫持。就是我们的点击，拖放，触屏操作被劫持了，而去操作了其它的透明隐藏的界面。
**原理是利用透明层iframe,使用了CSS中的opacity或z-index等属性，来到达透明和位于其它界面的上方，然后使用iframe来嵌入劫持页面。**到达了用户操作的不是它看到的界面，不是他以为的那个界面，而是那个透明的位于上层的界面。
代码：
黑客可能会尝试在一个隐藏的iframe中嵌入你的页面，并诱使用户在该iframe上进行操作。
html
<body style="height: 100%; margin: 0;">
<iframe width="100%" height="100%" frameborder="0" src="https://www.taobao.com/"></iframe>
<div id="box">
黑客网站
</div>
</body>
css
#box {
width: 100%;
height: 100%;
position: fixed;
left: 0;
top: 0;
background: transparent;
opacity: 0
}
2、界面劫持的防范
（1）前端防护
将下面这段代码放到网站页面的body标签前
主要用于检查当前页面是否在一个iframe中。如果是，它会尝试将顶级窗口（top）的URL设置为当前窗口（self）的URL，从而尝试从iframe中“跳出”到主页面。这样别人在通过iframe框架引用你的网站网页时，浏览器会自动跳转到你的网站所引用的页面上。这通常也是为了防止点击劫持攻击。
<script>
if(top.location!=self.location){
top.location=self.location;
}
</script>
（2）服务器防护
使用X-Frame-Options防止网页被iframe，X-FRAME-OPTIONS是微软提出的一个http头，专门用来防御利用iframe嵌套的点击劫持攻击
DENY //拒绝任何域加载（不允许任何页面通过iframe嵌入当前页面）
SAMEORIGIN // 允许同源域下加载（只有同源的页面才能通过iframe嵌入）
ALLOW-FROM // 可以定义允许iframe加载的页面地址
原文地址：https://blog.csdn.net/qq_53911056/article/details/136241915
免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！