Web前端安全问题：XSS攻击、CSRF攻击、点击劫持

---

【面试篇】寒冬求职之你必须要懂的Web安全

---

前端有哪些攻击方式？

XSS攻击、CSRF攻击、点击劫持

1. XSS攻击

XSS(Cross-Site Scripting，跨站脚本攻击)是一种代码注入攻击。攻击者在目标网站上注入恶意代码，当被攻击者登陆网站时就会执行这些恶意代码，这些脚本可以读取 cookie，session tokens，或者其它敏感的网站信息，对用户进行钓鱼欺诈，甚至发起蠕虫攻击等。

XSS 本质原理

XSS 的本质原理是： 恶意代码未经过滤，与网站正常的代码混在一起；浏览器无法分辨哪些脚本是可信的，导致恶意脚本被执行。由于直接在用户的终端执行，恶意代码能够直接获取用户的信息，利用这些信息冒充用户向网站发起攻击者定义的请求。
攻击者向有 XSS 漏洞的网站中输入恶意的 HTML 代码，当其它用户浏览该网站时候，该段 HTML 代码会自动执行，从而达到攻击的目的，如盗取用户的 Cookie，破坏页面结构，重定向到其它网站等。

XSS分类

根据攻击的来源，XSS攻击可以分为存储型(持久性)、反射型(非持久型) 和 DOM型三种。

防御 XSS 攻击

防御 XSS 攻击最简单直接的方法就是过滤用户的输入。

1. 如果不需要用户输入 HTML，可以直接对用户的输入进行 HTML 转义
2. 当用户需要输入 HTML 代码时：更好的方法可能是，将用户的输入使用 HTML 解析库进行解析，获取其中的数据。然后根据用户原有的标签属性，重新构建 HTML 元素树。构建的过程中，所有的标签、属性都只从白名单中拿取。

如何去检测XSS攻击，怎么知道自己的页面是否存在XSS漏洞？

1.使用通用 XSS 攻击字串手动检测 XSS 漏洞
2.使用第三方工具进行扫描：

• Arachni
• Mozilla HTTP Observatory
• w3af

---

2. CSRF

CSRF（Cross-site request forgery）跨站请求伪造：攻击者诱导受害者进入第三方网站，在第三方网站中，向被攻击网站发送跨站请求。利用受害者在被攻击网站已经获取的注册凭证，绕过后台的用户验证，达到冒充用户对被攻击的网站执行某项操作的目的。
CSRF 可以简单理解为：攻击者盗用了你的身份，以你的名义发送恶意请求，容易造成个人隐私泄露以及财产安全。

典型的CSRF攻击流程：

受害者登录A站点，并保留了登录凭证（Cookie）。
攻击者诱导受害者访问了站点B。
站点B向站点A发送了一个请求，浏览器会默认携带站点A的Cookie信息。
站点A接收到请求后，对请求进行验证，并确认是受害者的凭证，误以为是无辜的受害者发送的请求。
站点A以受害者的名义执行了站点B的请求。
攻击完成，攻击者在受害者不知情的情况下，冒充受害者完成了攻击。

CSRF的特点

1.攻击通常在第三方网站发起，如图上的站点B，站点A无法防止攻击发生。
2.攻击利用受害者在被攻击网站的登录凭证，冒充受害者提交操作；并不会去获取cookie信息(cookie有同源策略)
3.跨站请求可以用各种方式：图片URL、超链接、CORS、Form提交等等(来源不明的链接，不要点击)

如何防范CSRF攻击?

过滤用户输入的内容不能阻挡 CSRF 攻击，我们需要做的事过滤请求的来源，因为有些请求是合法，有些是非法的，所以 CSRF 防御主要是过滤那些非法伪造的请求来源。

关键操作只接受 POST 请求

1. 添加验证码(体验不好)
2. 判断请求的来源：检测Referer(并不安全，Referer可以被更改)
3. 使用Token(主流)

CSRF攻击之所以能够成功，是因为服务器误把攻击者发送的请求当成了用户自己的请求。那么我们可以要求所有的用户请求都携带一个CSRF攻击者无法获取到的Token。服务器通过校验请求是否携带正确的Token，来把正常的请求和攻击的请求区分开。跟验证码类似，只是用户无感知。

• 服务端给用户生成一个token，加密后传递给用户
• 用户在提交请求时，需要携带这个token
• 服务端验证token是否正确

4. Samesite Cookie属性

3. 点击劫持

点击劫持是指在一个Web页面中隐藏了一个透明的iframe，用外层假页面诱导用户点击，实际上是在隐藏的frame上触发了点击事件进行一些用户不知情的操作。

典型点击劫持攻击流程

攻击者构建了一个非常有吸引力的网页
将被攻击的页面放置在当前页面的 iframe 中
使用样式将 iframe 叠加到非常有吸引力内容的上方
将iframe设置为100%透明
你被诱导点击了网页内容，你以为你点击的是***，而实际上，你成功被攻击了。