前端安全

一般而言，作为前端研发同学来说，对于网络安全感触不会很深。个人理解主要是

1. 我们的业务场景和编程范畴没有特别多的涉及到
2. 我们的浏览器默认提供了很多安全的策略 来保障
3. 更多的被后端业务所承担

但是目前为止，我们web安全的需求越来越紧迫，尤其是国家战略层面都开始关注用户隐私安全等。

安全策略

同源策略（Same-origin policy）

关于同源的定义：协议、域名、端口 都相同则是同源，其他任意一个不同 就是非同源。

同源策略主要变现在DOM, Web数据, 网络 三个方面。

1. DOM
   打开一个任意页面，从这个页面打开一个同源的页面，在第二个页面的控制台输入下面的js脚本

window.opener.document.body.style.display = 'none'

我们发现 第一个页面 被隐藏了。

如果打开的是一个非同源的页面，就无法进行操作。

2. web存储
   Cookie、IndexDB、LocalStorage 等数据

3. 网络请求
   XMLHttpRequest

常见的web安全问题

1. xss(cross site script) 跨站脚本 攻击
   ① 存储型
   ② 反射性
   ③ 传输过程中的 注入攻击脚本

处理方案：
1. 脚本关键字转码或者过滤
2. CSP
3. httpOnly
4. https

---

2. CSRF (Cross-site request forgery) 跨站请求伪造
   需要满足三个条件
   ① 被攻击站点有 CSRF 漏洞
   ② 用户登录了站点 持有一些状态
   ③ 用户点击触发攻击的请求。
   这种攻击在当前 前端通过XHR已经token校验的情况下 比较难以实现。