前端最基础的就是 HTML+CSS+Javascript
。掌握了这三门技术就算入门,但也仅仅是入门,现在前端开发的定义已经远远不止这些。前端小课堂(HTML/CSS/JS
),本着提升技术水平,打牢基础知识的中心思想,我们开课啦(每周四)。
拖更小伙又来了,今天我们来聊聊 web 网络攻击。
- XSS (跨站脚本攻击)
- CSRF (跨站请求伪造)
-
劫持
- 运营商劫持
- 中间人攻击
- XFF (伪造 XFF 头绕过服务器 IP 过滤)
- 文件上传
-
风控
- 刷优惠券
- 拉新套现
- 撞库、暴力破解
- 短信轰炸、邮件轰炸
- CSP (内容安全策略)
XSS 跨站脚本攻击
XSS 应该是前端遇到次数最多的问题。通过一些手段,注入一段文字,实现攻击。
xss 攻击场景
- 评论区,
<input>
标签 输入,<div>
标签 输出<input value="xss">
本意是输入一段文字,结果显示成了输入框 - 个人资料编辑,
<input>
标签 输入,<input>
标签 输出"><script>alert()</scrpit>
本意是编辑文本,结果因为拼接导致字符串被异常隔开。 - 富文本
比较复杂,需要用白名单过滤,不在白名单中的都转义 - url 填写处,a 链接或者 img 图片
https://lilnong.top "onclick="alert(1)"
判断 url 合法,防止拼接异常
xss 防御方法
- 富文本使用白名单区分。
-
输出,使用插值或转义
- 插值
innerText
setAttribute()
- 转义
<
变成<
、"
变成"
等
- 插值
-
url 处理,插值或过滤
- 推荐使用插值
- encodeURI
CSRF 跨站请求伪造
XSS 是通过把代码注入,在其他客户端机器上执行。CSRF 是通过诱导用户,在其他站上,触发请求。
CSRF 攻击场景
- 直播送礼,调用接口
sendGift(liveid, anchorid, giftid)
,服务端验证 cookie。
突然,QQ 收到一个链接,礼物免费领。你打开,这个网页背后默默的调用了sendGift(liveid, anchorid, giftid)
,只不过他传的 liveid、anchorid 都是他自己的。但是因为cookie
的机制,会默认带上,导致服务端认为这是你主动触发的一次操作。 - 修改密码,有的修改密码不需要检验旧密码。诱导网页后台直接修改密码。
CSRF 防护
-
Referrer
校验 -
token
令牌。
比如阿里云,将令牌直接输出到网页中,如果要进行敏感操作,需要传过去令牌。令牌 一次有效 , 最新有效 。
因为有跨域限制,不同源网页之间无法获取内容。
劫持攻击 & 中间人攻击
运营商劫持
http 移动端比较多。
- 不良运营商,非法植入广告。
- 公共 wifi,非法劫持。
中间人攻击
中间人也可以理解为伪装的运营商,只不过运营商属于公众,不会太过分。实施中间人攻击时,攻击者常考虑的方式是 ARP 欺骗或 DNS 欺骗等
- 信息篡改
当主机 A、和主机 B 通信时,都由主机 C 来为其“转发”。而 A、B 之间并没有真正意思上的直接通信,他们之间的信息传递同 C 作为中介来完成,但是 A、B 却不会意识到,而以为它们之间是在直接通信。这样攻击主机在中间成为了一个转发器,C 可以不仅窃听 A、B 的通信还可以对信息进行篡改再传给对方,C 便可以将恶意信息传递给 A、B 以达到自己的目的。 - 信息窃取
代理服务器。当 A、B 通信时,C 不主动去为其“转发”,只是把他们的传输的数据备份,以获取用户网络的活动,包括账户、密码等敏感信息。
XFF (伪造 XFF 头绕过服务器 IP 过滤)
- 刷票
- 爬虫
当然,他会有真实的 ip,只需要按真实 ip 过滤即可。
同样,又出现大量的代理。a 请求代理,代理请求服务端,这样只能做个池子过滤了。
文件上传
有时候,我们需要做一个富文本编辑器,其中就有上传的功能,我们一般来说是先把他所有实例代码部署。之后先看看是否符合要求。最后接入修改。
问题就出现在了这里。有时一些代码未删除,或者漏删。这个时候就有问题了,因为是测试代码,未限制类型。比如 攻击者上传 jsp 代码。
防护方案
- 限制可上传类型,比如只可以上传图片类型,视频类型。尽量避免可执行代码。
- 上传目录控制,尽量使用新的存储。防止走模板引擎
- 后缀名防护,html 替换为 txt
- 上 cdn。前端跨域,相对来说可以避免很多问题(跨域也会引起问题,比如图片合成,源会被污染)。
风控
风控属于一个持续工程。属于一个可以分层封禁的。
-
刷优惠券、拉新套现
- 限制账户(微信账户,手机号)
- 限制 ip()
- 限制设备(机器码,客户端能获取)
-
撞库、暴力破解、短信轰炸、邮件轰炸
- 限制频率(同一地址每天 10 次)
说说破解方案。
- 人力刷,无敌。只能说拉来的不是有效用户。所以要结合业务,转为有效用户或者限制个数。
-
机刷
- ip 限制。代理池
- 账号限制。和多号,阿里小号,等等一些平台,低价账号,然后养号。
说到底,还是要 结合业务 。找到具体的控制线。
比如说,根据用户等级,确定用户活跃度,30 级以下 10 个名额,30 级以上 20 个名额,80 级以上 30 个名额,心悦 8 40 个名额。
CSP (内容安全策略)
掘金使用的是这个方案。它可以 禁止使用不安全来源的资源。
内容安全策略 (CSP) 是一个额外的安全层,用于检测并削弱某些特定类型的攻击,包括跨站脚本 (XSS) 和数据注入攻击等。无论是数据盗取、网站内容污染还是散发恶意软件,这些攻击都是主要的手段。
CSP 通过指定有效域——即浏览器认可的可执行脚本的有效来源——使服务器管理者有能力减少或消除 XSS 攻击所依赖的载体。一个 CSP 兼容的浏览器将会仅执行从白名单域获取到的脚本文件,忽略所有的其他脚本 (包括内联脚本和 HTML 的事件处理属性)。
作为一种终极防护形式,始终不允许执行脚本的站点可以选择全面禁止脚本执行。
有两种设置方式
- 服务端返回
Content-Security-Policy
HTTP 头部 - 网页中设置
<meta http-equiv="Content-Security-Policy" content="default-src'self'; img-src https://*; child-src'none';">
CSP 限制
-
default-src
默认,给所有配置项设置。 -
child-src
WebWorker 和<frame>
<iframe>
嵌套浏览上下文。 -
connect-src 脚本接口加载的链接地址
- ping
- Fetch
- XMLHttpRequest
- WebSocket
- EventSource
- font-src 加载的字体的有效源
@font-face
。 - frame-src
<frame>
和<iframe>
的有效源。 - img-src 图像和图标的有效来源。
- manifest-src manifest 有效源
- media-src 媒体来源有效 <audio>,<video> 和 <track> 元素。
- object-src <object>,<embed> 和 <applet> 元素。
- script-src JavaScript 的有效源。可以限制行内无效
- style-src 样式表的有效源。
- worker-src 指定有效来源 Worker,SharedWorker 或 ServiceWorker 脚本。
资料
- 前端培训目录、前端培训规划、前端培训计划
- 内容安全策略(CSP) – HTTP | MDN