深入Web安全（攻击篇)

前言

随着互联网的高速发展，信息安全问题已经成为企业最为关注的焦点之一，而前端又是引发企业安全问题的高危据点。在移动互联网时代，前端人员除了传统的 XSS、CSRF 等安全问题之外，又时常遭遇网络劫持、非法调用 Hybrid API 等新型安全问题。当然，浏览器自身也在不断在进化和发展，不断引入 CSP、Same-Site Cookies 等新技术来增强安全性，但是仍存在很多潜在的威胁，这需要前端技术人员不断进行“查漏补缺”，那么这篇文章就带领大家梳理Web安全的知识点，此篇是攻击篇，下篇将会带来防御篇~

一、 XSS（跨站脚本攻击）

XSS (Cross-Site Scripting)，跨站脚本攻击，因为缩写和CSS重叠，所以只能叫 XSS。跨站脚本攻击是指通过存在安全漏洞的Web网站注册用户的浏览器内运行非法的HTML标签或JavaScript进行的一种攻击。

1. XSS的一些特点

• 通常难以从UI上感知（暗地执行脚本）
• 窃取用户信息
• 绘制UI（例如弹窗），诱骗用户点击/填写表单

2. XSS demo

3. XSS的分类

存储型XSS

特点：* 恶意脚本被存在数据库中

• 访问页面——>读数据——> 被攻击
• 危害最大，对全部用户可见 存储型 XSS 的攻击步骤：

1.攻击者将恶意代码提交到目标网站的数据库中。
2.用户打开目标网站时，网站服务端将恶意代码从数据库取出，拼接在 HTML 中返回给浏览器。
3.用户浏览器接收到响应后解析执行，混在其中的恶意代码也被执行。
4.恶意代码窃取用户数据并发送到攻击者的网站，或者冒充用户的行为，调用目标网站接口执行攻击者指定的操作。

举个🌰子，假如你正开开心心回家看着爱奇艺，在爱奇艺中了XSS攻击，你的用户名密码等可能就被窃取，从此电商网站上多了一个共享账户，而你还被踢了！！！😭

反射型XSS

特点：* 不涉及数据库

• 从URL上攻击

反射型 XSS 的攻击步骤：

1.攻击者构造出特殊的 URL，其中包含恶意代码。
2.用户打开带有恶意代码的 URL 时，网站服务端将恶意代码从 URL 中取出，拼接在 HTML 中返回给浏览器。
3.用户浏览器接收到响应后解析执行，混在其中的恶意代码也被执行。
4.恶意代码窃取用户数据并发送到攻击者的网站，或者冒充用户的行为，调用目标网站接口执行攻击者指定的操作。 URL：

反射型 XSS 跟存储型 XSS 的区别是：存储型 XSS 的恶意代码存在数据库里，反射型 XSS 的恶意代码存在 URL 里。

DOM型XSS

特点：* 不需要服务器参与

• 恶意攻击的发起 + 执行，全在浏览器完成

DOM 型 XSS的攻击步骤：

1.攻击者构造出特殊的 URL，其中包含恶意代码。
2.用户打开带有恶意代码的 URL。
3.用户浏览器接收到响应后解析执行，前端 JavaScript 取出 URL 中的恶意代码并执行。
4.恶意代码窃取用户数据并发送到攻击者的网站，或者冒充用户的行为，调用目标网站接口执行攻击者指定的操作。 URL:

DOM 型 XSS 跟前两种 XSS 的区别：DOM 型 XSS 攻击中，取出和执行恶意代码由浏览器端完成，属于前端 JavaScript 自身的安全漏洞，而其他两种 XSS 都属于服务端的安全漏洞。

基于浏览器的XSS攻击

特点：* 利用了浏览器渲染DOM的特性（独特优化）

• 不同浏览器，会有区别（按浏览器进行攻击）

二、 CSRF（跨站伪站请求）

CSRF（Cross-site request forgery）跨站请求伪造：攻击者诱导受害者进入第三方网站，在第三方网站中，向被攻击网站发送跨站请求。利用受害者在被攻击网站已经获取的注册凭证，绕过后台的用户验证，达到冒充用户对被攻击的网站执行某项操作的目的。

1. CSRF的一些特点

• 在用户不知情的前提下
• 利用用户权限（cookie）
• 构造指定HTTP请求，窃取或修改用户敏感信息

2. CSRF demo

举个🌰子，用户收到一封邮件，然后其中有一个链接，用户点击链接跳转到恶意的页面B，在恶意页面B中发出了一个向域名A的请求，此时这个请求会带上域名A特有的cookie,域名A所处的服务器接受到这个请求之后去验证cookie,发现是合法用户，认为这是可以处理的请求，执行请求，返回结果。这就是跨站伪造请求的思路

• 受害者登录a.com，并保留了登录凭证（Cookie）。
• 攻击者引诱受害者访问了b.com。
• b.com 向 a.com 发送了一个请求：a.com/act=xx。浏览器会默认携带a.com的Cookie。
• a.com接收到请求后，对请求进行验证，并确认是受害者的凭证，误以为是受害者自己发送的请求。
• a.com以受害者的名义执行了act=xx。
• 攻击完成，攻击者在受害者不知情的情况下，冒充受害者，让a.com执行了自己定义的操作。

3. CSRF攻击的分类

GET类型的CSRF

GET类型的CSRF利用非常简单，只需要一个HTTP请求，一般会这样利用：

 <img src="https://awps-assets.meituan.net/mit-x/blog-images-bundle-2018b/ff0cdbee.example/withdraw?amount=10000&for=hacker)" style="margin: auto" />

在受害者访问含有这个img的页面后，浏览器会自动向http://bank.example/withdraw?account=xiaoming&amount=10000&for=hacker发出一次HTTP请求。bank.example就会收到包含受害者登录信息的一次跨域请求。

POST类型的CSRF

这种类型的CSRF利用起来通常使用的是一个自动提交的表单，如：

 <form action="http://bank.example/withdraw" method=POST><input type="hidden" name="account" value="xiaoming" /><input type="hidden" name="amount" value="10000" /><input type="hidden" name="for" value="hacker" />
</form>
<script> document.forms[0].submit(); </script> 

访问该页面后，表单会自动提交，相当于模拟用户完成了一次POST操作。

POST类型的攻击通常比GET要求更加严格一点，但仍并不复杂。任何个人网站、博客，被黑客上传页面的网站都有可能是发起攻击的来源，后端接口不能将安全寄托在仅允许POST上面。

三、 SQL注入

SQL注入即是指web应用程序对用户输入数据的合法性没有判断或过滤不严，攻击者可以在web应用程序中事先定义好的查询语句的结尾上添加额外的SQL语句，在管理员不知情的情况下实现非法操作，以此来实现欺骗，执行非授权的任意查询，从而进一步得到相应的数据信息。

四、 注入不止SQL

• CLI
• OS command
• SSRF，服务端伪造请求，严格而言，SSRF不是injection，但是原理类似。

五、 DoS(Denial of Service)

通过某种方式（构造特定请求），导致服务器资源被显著消耗，来不及响应更多请求，导致请求挤压，进而雪崩效应。

正则表达式——贪婪模式

重复匹配时[?] vs [no ?]：满足“一个”即可 vs 尽量多

基于正则表达式的Dos

贪婪：n次不行？n-1次再试试？——回溯

六、 DDoS(Distributed DoS)

短时间内，来自大量僵尸设备的请求流量，服务器不能及时完成全部请求，导致请求堆积，进而雪崩效应，无法响应新请求。

不搞复杂的，量大就完事儿了DDoS攻击特点:* 直接访问IP

• 任意API
• 消耗大量带宽（耗尽）

SYN洪水攻击

七、 中间人攻击

中间人攻击就是浏览器和服务器彼此以为在相互沟通，而实际上是中间人在之中去窃取信息修改请求，比较典型的中间人有恶意的APP，譬如Webview,譬如你家的路由器。

1.明文传输
2.信息篡改不可知
3.对方身份未验证