1.XSS
什么是XSS？
XSS是跨站脚本攻击（Cross-Site Scripting）的简称。
XSS的本质是浏览器错误的将攻击者提供的用户输入数据当做JavaScript脚本给执行。
防御
对输入进行严格的数据编码。
设置CSP HTTP Header、输入验证、开启浏览器XSS防御。
参考文章
前端防御从入门到弃坑--CSP变迁
CSP Is Dead, Long Live CSP! 翻译
2.iframe
什么是iframe？
iframe是一个容器。该容器可以把另一个HTML页面嵌入到当前页面。
iframe中的内容是由第三方来提供的，默认情况下他们不受我们的控制，他们可以在iframe中运行JavaScirpt脚本、Flash插件、弹出对话框等等，这可能会破坏前端用户体验。
iframe中的域名因为过期而被恶意攻击者抢注，iframe中的内容被替换掉了，从而利用用户浏览器中的安全漏洞下载安装木马、恶意勒索软件。
防御
使用iframe的sandbox的安全属性。
参考文章
3.点击劫持
什么是点击劫持？
通过iframe引用第三方内容，制作一个透明层到上面，引导到自己的页面。
防御
使用X-Frame-Options:DENY这个HTTP Header来阻止别人iframe引用自家页面。
参考文章
X-Frame-Options防止网页放在iframe中
X-Frame-Options 响应头
4.浏览器的容错能力
浏览器怎么容错？
部分浏览器根据响应内容来推断其类型，而不是根据响应头(Content-Type Header)的MIME types属性。
某网站允许用户在评论里上传图片，攻击者在上传图片的时候，看似提交的是个图片文件，实则是个含有JavaScript的脚本文件。该文件逃过了文件类型校验。 受害者在访问这段评论的时候，浏览器会去请求这个伪装成图片的JavaScript脚本。
后端通过Content-Type Header建议浏览器按照图片来渲染这次的HTTP响应，但是浏览器发现响应中其实是JavaScript，于是就擅自做主把这段响应当做JS脚本来解释执行
防御
设置X-Content-Type-Options这个HTTP Header明确禁止浏览器去推断响应类型。
参考文章
5.HTTPS中间人攻击
浏览器发出去第一次请求就被攻击者拦截了下来并做了修改，根本不给浏览器和服务器进行HTTPS通信的机会。大致过程如下，用户在浏览器里输入URL的时候往往不是从https://开始的，而是直接从域名开始输入，随后浏览器向服务器发起HTTP通信，然而由于攻击者的存在，它把服务器端返回的跳转到HTTPS页面的响应拦截了，并且代替客户端和服务器端进行后续的通信。由于这一切都是暗中进行的，所以使用前端应用的用户对此毫无察觉。
防御
使用HSTS。
