前端安全：防范点击劫持的两种方式

最新推荐文章于 2024-05-11 17:46:39 发布

weixin_34414650

最新推荐文章于 2024-05-11 17:46:39 发布

阅读量607

点赞数

文章标签：前端 ViewUI

原文链接：https://segmentfault.com/a/1190000011635300

版权

近期的工作都和交易有关，写代码都特别谨慎，前面说过前端如何防范跨站请求伪造攻击（CSRF），这次准备简单说说防范点击劫持。

什么点击劫持？最常见的是恶意网站使用 <iframe> 标签把我方的一些含有重要信息类如交易的网页嵌入进去，然后把 iframe 设置透明，用定位的手段的把一些引诱用户在恶意网页上点击。这样用户不知不觉中就进行了某些不安全的操作。

有两种方式可以防范。

判断顶层视口的域名是不是和本页面的域名一致，如果不一致就让恶意网页自动跳转到我方的网页。当然你还可以恶心一下这些恶意网站，比如说弹窗十几次，或者跳转到某些404页面。

if (top.location.hostname !== self.location.hostname) {
    alert("您正在访问不安全的页面，即将跳转到安全页面！");
    top.location.href = self.location.href;
}

通过配置 nginx 发送 X-Frame-Options 响应头，这样浏览器就会阻止嵌入网页的渲染。更详细的可以查阅MDN上关于X-Frame-Options 响应头的内容。

add_header X-Frame-Options SAMEORIGIN;

原文首发在我的 github 博客

关注