点击劫持详细透析

点击劫持（Clickjacking）是一种前端安全攻击手段，攻击者通过视觉欺骗诱导用户在不知情的情况下点击隐藏的页面元素，从而执行非预期的操作。以下是攻击过程的详细说明：

---

攻击过程步骤

1. 攻击者构造恶意页面

   • 创建一个恶意网页，其中包含一个透明的 <iframe>，指向目标网站（如社交网络、银行页面等）的敏感操作页面（如“关注用户”“确认转账”按钮）。

   • 示例代码：

     <iframe src="https://victim.com/transfer?amount=1000" style="opacity:0; position:absolute; top:0; left:0"></iframe>

2. 诱骗用户访问恶意页面

   • 通过钓鱼邮件、社交工程或恶意广告链接，诱使用户访问该恶意页面。

3. 视觉欺骗布局

   • 使用 CSS 将 <iframe> 覆盖在用户可见的“诱饵内容”上（如虚假按钮、游戏界面）。通过调整 z-index、opacity 和 position 使其透明且覆盖在诱饵元素之上。

   • 示例布局：

     <!-- 诱饵内容：用户看到的虚假按钮 -->
     <button style="position:absolute; top:100px; left:100px">点击抽奖！</button>
     
     <!-- 隐藏的 iframe：覆盖在虚假按钮上 -->
     <iframe 
       src="https://victim.com/confirm-transfer" 
       style="opacity:0; position:absolute; top:100px; left:100px; width:200px; height:50px; z-index:999">
     </iframe>

4. 用户触发非预期操作

   • 用户点击看似无害的“诱饵内容”（如“抽奖按钮”），实际点击的是透明 <iframe> 中的敏感操作按钮（如“确认转账”）。

5. 攻击完成

   • 目标网站收到用户“合法”的请求（因用户已登录，携带了 Cookie 或身份凭证），执行攻击者预设的操作（如转账、关注、修改设置等）。

---

具体攻击场景示例

1. 社交媒体关注劫持

   • 透明 iframe 加载“关注用户”页面，覆盖在虚假的“关闭广告”按钮上。用户点击“关闭”时实际关注了攻击者的账号。

2. 银行转账劫持

   • iframe 加载已填写好的转账页面，覆盖在游戏界面的“开始游戏”按钮上。用户点击后触发转账操作。

3. 权限提升攻击

   • 诱导用户点击隐藏的管理员操作界面（如“授予权限”按钮），提升攻击者账户权限。

---

防御手段

1. 服务端防御

   • X-Frame-Options HTTP 头：禁止页面被嵌入 iframe。

     add_header X-Frame-Options "DENY";  # 或 "SAMEORIGIN"

   • Content Security Policy (CSP)：通过 frame-ancestors 指令限制页面嵌套来源。

     add_header Content-Security-Policy "frame-ancestors 'none';";

2. 前端防御

   • JavaScript 反嵌套脚本：检测页面是否被嵌入，若是则跳转或隐藏内容。

     if (top !== self) top.location = self.location;

   • 视觉干扰：通过 CSS 模糊、覆盖层防止透明 iframe 生效（需结合其他方法）。

3. 用户侧防御

   • 使用浏览器插件（如 NoScript）禁止未经信任的脚本和 iframe。

---

总结

点击劫持利用用户对可见内容的信任，通过前端技术实现隐蔽操作。防御需结合服务端头部设置、前端检测和用户安全意识，才能有效阻断此类攻击。