点击劫持

什么是点击劫持？

点击劫持是一种视觉欺骗的攻击手段，攻击方诱导用户点击一个看不见的网页或者经过伪装的元素，实际上用户点击的并不是自己看到的网页，而是这个网页上层的一个透明网页，这种攻击可能会导致用户下载恶意软件、泄露个人信息、或者在不知情的情况下进行转账、购物等等。

一般情况下，攻击方是把需要攻击的网站通过 iframe 嵌入到自己的网页中，再设置其为透明或伪装成其他元素。用户访问攻击方的网页，可能会看到一个“领取免费礼物”的按钮，但实际上用户点击这个按钮，却是点击了这个按钮上方的透明网页，这个看不见的网页可能是用户的银行转账页面，而用户点击了按钮之后，就同意转账了。

p.s. 因为浏览器可能会对透明的 iframe 做一些安全检测，所以攻击方可能会把网页设置成 opacity: 0.0001; 之类的，越过浏览器的检测阈值。

如何防御点击劫持？

1. 客户端防御：JS 防御

2. 服务器防御：X-Frame-Options 和 Content Security Policy (CSP)

JS 防御

• 检查当前网页的 window 是否 top-window，如果不是，那就把它改成 top-window

• 把所有 frame 都设为不透明的

• 阻止透明 frame 上的点击事件

• ...

但 JS 防御很容易被绕过，比如浏览器可能设置了禁止执行 JS 脚本，或者攻击方可能会利用 HTML5 iframe 的 sandbox 属性。

X-Frame-Options

X-Frame-Options 是一个 HTTP 响应头部字段，用来控制浏览器是否可以在 <frame> 或者 <iframe> 标签中展示当前页面，有以下几个可以设置的值：

• DENY: 不允许任何网站在 iframe 中展示当前网页

• SAMEORIGIN: 在域名相同的情况下，可以允许将当前页面在 iframe 中展示

• ALLOW-FROM URI: 在指定的 URI 中，允许当前页面在 iframe 中展示

缺点

1. 如果要使用 SAMEORIGIN，需要在网站的每一个单独的页面中都返回 X-Frame-Options 头部

2. 使用 ALLOW-FROM URI 的时候，不支持设置多个 URI

3. X-Frame-Options 只能设置一个值

4. 大部分浏览器都不支持 ALLOW-FROM 选项

5. X-Frame-Options 在大部分浏览器中已经被丢弃

Content Security Policy (CSP)

Content Security Policy 也是一个 HTTP 响应头部，我们可以通过设置 frame-ancestors 指令来指定哪些源可以通过 <iframe> 等方式来展示当前页面，可以指定一个或多个源。

用法

Content-Security-Policy: frame-ancestors <source> <source>;

e.g.

Content-Security-Policy: frame-ancestors 'none';

Content-Security-Policy: frame-ancestors 'self' https://www.example.org;

• none: 是一个关键字，跟 X-Frame-Options 的 DENY 一样

• self: 是一个关键字，跟 X-Frame-Options 的 SAMEORIGIN 一样

• 此外还可以指定多个 URI

READING

• https://www.imperva.com/learn/application-security/clickjacking/
• https://portswigger.net/web-security/clickjacking (notes: read the extension readings in this blog when you got time)