伴随着前端技术的不断发展，Web 应用已经随处可见了。随之而来的问题就是，谁来保护用户的隐私和网络安全？
一、网络安全
网络安全是指网络系统的硬件、软件及其系统中的数据受到保护，不因偶然的或者恶意的原因而遭受到破坏、更改、泄露，系统连续可靠正常地运行，网络服务不中断。
网络安全主要有如下特征：
1.保密性：信息不泄露给非授权用户、实体或过程，或供其利用的特性。
2.完整性：数据未经授权不能进行改变的特性。
即信息在存储或传输过程中保持不被修改、不被破坏和丢失的特性。
3.可用性：可被授权实体访问并按需求使用的特性。
即当需要时能否存取所需的信息。例如网络环境下拒绝服务、破坏网络和有关系统的正常运行等都属于对可用性的攻击；
4.可控性 ：对信息的传播及内容具有控制能力。
5.可审查性：出现安全问题时提供依据与手段。
通过上面，我们也了解到网络安全其实与我们息息相关，而作为 Web 前端开发工程师，这方面知识一定要了解，因为我们是距离用户最近的开发者。
所以我们先从 Web 最常见的 XSS 和 CSRF 攻击来入手吧。
这个时代软件的特点就是：解决了用户痛点，就能为王！
二、什么是 XSS ？
跨站脚本攻击（Cross Site Scripting，为了不和层叠样式表 CSS 混淆，故将跨站脚本攻击缩写为 XSS)。
恶意攻击者往 Web 页面里插入恶意 Script 代码，当用户浏览该页之时，嵌入其中 Web 里面的 Script 代码会被执行，从而达到恶意攻击用户的目的。
XSS 主要有如下三种分类：
1.Reflected XSS（基于反射的 XSS 攻击）
主要通过利用系统反馈行为漏洞，并欺骗用户主动触发，从而发起 Web 攻击。
2.Stored XSS（基于存储的 XSS 攻击）
Stored XSS 和 Reflected XSS 的差别就在于，具有攻击性的脚本被保存到了服务器并且可以被普通用户完整的从服务的取得并执行，从而获得了在网络上传播的能力。
3.DOM-based or local XSS（基于 DOM 或本地的 XSS 攻击）
DOM 型 XSS 其实是一种特殊类型的反射型 XSS，它是基于 DOM 文档对象模型的一种漏洞。
可以通过 DOM 来动态修改页面内容，从客户端获取 DOM 中的数据并在本地执行。基于这个特性，就可以利用 JS 脚本来实现 XSS 漏洞的利用。
XSS 是一门又热门又不太受重视的 Web 攻击方式，为什么会这样呢，原因如下：
- 耗时间；
- 有一定几率不成功；
- 没有相应的软件来完成自动化攻击；
- 前期需要基本的 HTML、JS 功底，后期需要扎实的 HTML、JS、ActionScript2/3.0等语言的功底；
- 是一种被动的攻击手法；
- 对 Website 有 http-only、crossdomian.xml 没有用。
但是这些并没有影响黑客对此漏洞的偏爱，原因只有一个：XSS几乎每个网站都存在。
三、XSS 情景再现
为了更好的说明 XSS，我们来举一些小栗子：
1.在网页 input 或者 textarea 中输入 ，如果弹出 alert对话框，则说明网站存在 XSS 漏洞。
请注意：我们经常在一些博客网站或者论坛底下的留言框看到 alert，你以为是用户热情，其实他们是想搞你！
2.只要网页存在 XSS 漏洞，攻击者可能会嵌入 JS 脚本，如：
// 获取 cookie ，发送用户信息等
3.图片也可能会被利用，如：
4.直接使用 URL 参数攻击，如：
https://www.baidu.com?jarttoTest=
当然，这里需要注意的是，URL 也有可能是不知来历的二维码，所以请慎重扫码。
到这里你可能就了解了，XSS 的目的就是在目标页面执行不为人知的 JS 脚本，从而窥探用户隐私甚至财产。
四、XSS 漏洞检测以及防御
通常有一些方式可以测试网站是否有正确处理特殊字符，具体如下：
防御手段可以采取如下方式：
1.对所有用户提交内容进行可靠的输入验证，包括对 URL、查询关键字、HTTP头、POST数据等，仅接受指定长度范围内、采用适当格式、采用所预期的字符的内容提交，对其他的一律过滤。
2.使用 HTTP 头指定类型，很多时候可以使用 HTTP 头指定内容的类型，使得输出的内容避免被作为 HTML 解析。
3.实现 Session 标记(session tokens)、CAPTCHA 系统或者 HTTP 引用头检查，以防功能被第三方网站所执行。
4.确认接收的的内容被妥善的规范化，仅包含最小的、安全的 Tag (没有 JS )，去掉任何对远程内容的引用(尤其是样式表和 JS )，使用 HTTP only 的 Cookie。
避免 XSS 的方法之一主要是将用户所提供的内容进行过滤，许多语言都有提供对 HTML的过滤，看似很简单，实则很有效。
五、总结
随着 Web2.0、社交网络、微博、自媒体等等一系列互联网产品的诞生，基于 Web 环境的互联网应用越来越广泛。
企业信息化的过程中各种应用都架设在 Web 平台上，Web 业务的迅速发展也引起黑客们的强烈关注，接踵而至的就是 Web 安全威胁的凸显。
在时代赋予 Web 前端开发使命的时候，我们应该比其他人更谨慎，更懂得应付危害网络安全的行为，任重而道远啊～
六、参考
Web 安全的三个攻防姿势
XSS 的原理分析与解剖
閱讀更多 F2EAwesome 的文章
