网络安全
# 网络安全
# XSS
Cross-site scripting，通常简称为：XSS ,是一种代码注入方式。
XSS 可分为三种：存储型，反射型及DOM型
DOM 型 XSS 跟前两种 XSS 的区别：DOM 型 XSS 攻击中，取出和执行恶意代码由浏览器端完成，属于前端 JavaScript 自身的安全漏洞，而其他两种 XSS 都属于服务端的安全漏洞。
XSS 两大攻击要素：
- 攻击者提交恶意代码
- 浏览器执行恶意代码
# 预防存储型和反射型 XSS 攻击
存储型和反射型 XSS 都是在服务端取出恶意代码后，插入到响应 HTML 中，被浏览器所执行。 常见预防方法：
- 改为纯前端渲染
- 对HTML转义
# 纯前端渲染
通过先加载一个纯静态 HTML ，此HTML 中不包含任何业务相关数据，浏览器执行 HTML 中的 JS ，然后 js 通过 ajax 异步加载业务数据，然后渲染在页面上。
# HTML转义
对输入的内容进行转义，如引号，尖括号，斜杠等。
function escape(str) {
str = str.replace(/&/g, "&");
str = str.replace(/</g, "<");
str = str.replace(/>/g, ">");
str = str.replace(/"/g, "&quto;");
str = str.replace(/'/g, "&##39;");
str = str.replace(/`/g, "&##96;");
str = str.replace(/\//g, "&##x2F;");
return str
}
2
3
4
5
6
7
8
9
10
通过转义可以将攻击代码<script>alert(1)</script> 变为
escape('<script>alert(1)</script>')
// -> <script>alert(1)<&##x2F;script>
2
但是不能通过上面的办法来转义所有字符，通常使用转义库。
# 预防 DOM 型 XSS 攻击
DOM 型 XSS 攻击，实际上就是网站前端 JavaScript 代码本身不够严谨，把不可信的数据当作代码执行了。
在使用 .innerHTML、.outerHTML、document.write() 时要特别小心，不要把不可信的数据作为 HTML 插到页面上，而应尽量使用 .textContent、.setAttribute() 等。
如果用 Vue/React 技术栈，并且不使用 v-html/dangerouslySetInnerHTML 功能，就在前端 render 阶段避免 innerHTML、outerHTML 的 XSS 隐患。
DOM 中的内联事件监听器，如 location、onclick、onerror、onload、onmouseover等，<a> 标签的 href 属性，JavaScript 的 eval()、setTimeout()、setInterval() 等，都能把字符串作为代码运行。如果不可信的数据拼接到字符串中传递给这些 API，很容易产生安全隐患，请务必避免。
# CSRF
跨站请求伪造，是一种挟制用户在当前已登录的Web应用程序上执行非本意的操作的攻击方法
简单来说， CSRF 就是利用用户的登录发起恶意请求
# 如何防御
- GET 请求不对数据进行修改
- 提交时要求附加本域才能获取的信息（CSRF Token，双重 Token 验证）
- 阻止不明外域的访问（同源检测， Samesite Cookie）
XSS和CSRF的区别：
- XSS是获取信息，不需要提前知道其他用户页面的代码和数据包
- CSRF代替用户完成指定的动作，需要知道其他页面的代码和数据包
- 原理不同，CSRF是利用网站A本身的漏洞，去请求网站A的api；XSS是向目标网站注入JS代码，然后执行JS里的代码。
- CSRF的目标是用户，而XSS的目标是服务器
# 网络劫持
网络劫持分为以下两种
- DNS 劫持 （如输入淘宝跳转京东）
- DNS强制解析: 通过修改运营商的本地DNS记录，来引导用户流量到缓存服务器
- 302跳转的方式: 通过监控网络出口的流量，分析判断哪些内容是可以进行劫持处理的,再对劫持的内存发起302跳转的回复，引导用户获取内容
- HTTP劫持: (访问谷歌但是一直有贪玩蓝月的广告),由于http明文传输,运营商会修改你的http响应内容(即加广告)
# 如何预防
DNS劫持由于涉嫌违法,已经被监管起来,现在很少会有DNS劫持,而http劫持依然非常盛行.
最有效的办法就是全站HTTPS,将HTTP加密,这使得运营商无法获取明文,就无法劫持你的响应内容.