前端Web开发的安全之旅 | 青训营笔记

124 阅读2分钟

这是我参与「第四届青训营 」笔记创作活动的的第6天

两个角度看web安全

  • 假如你是一个hacker--攻击
  • 假如你是一个开发者--防御

攻击篇

Cross-Site Scription(XSS)

截屏2022-08-01 12.46.09.png

XSS主要利用了

截屏2022-08-01 12.47.02.png

XSS的一些特点

截屏2022-08-01 12.47.28.png

XSS Demo

截屏2022-08-01 12.48.01.png

可以直接提交恶意脚本

截屏2022-08-01 12.49.18.png

Stored XSS

截屏2022-08-01 12.49.46.png

Reflected XSS

截屏2022-08-01 12.50.29.png

Reflected XSS Demo

截屏2022-08-01 12.50.58.png

DOM-based XSS

截屏2022-08-01 12.51.43.png

DOM-based XSS Demo

截屏2022-08-01 12.52.09.png

Reflected vs DOM-based

截屏2022-08-01 12.53.45.png

Mutation-based XSS

截屏2022-08-01 12.54.20.png

Cross-site request forgery(CSRF)

截屏2022-08-01 12.55.42.png

CSRF Demo

截屏2022-08-01 12.56.18.png

SQL Injection

截屏2022-08-01 12.58.29.png

Injection不止于SQL

  • CLI
  • OS command
  • Server-Side Request Forgery(SSRF),服务端伪造请求
  • 严格而言,SSRF不是injection,但是原理类似

Denial of Service(Dos)

通过某种方式(构造特定请求),导致服务器资源被显著消耗,来不及响应更多请求,导致请求挤压。进而雪崩效应。

插播:正则表达式--贪婪模式

截屏2022-08-01 13.05.10.png

Logical Dos

截屏2022-08-01 13.05.59.png

Logical Dos Demo

截屏2022-08-01 13.06.29.png

Distributed Dos(DDos)

短时间内,来自大量僵尸设备的请求流量,服务器不能及时完成全部请求,导致请求堆积,进而雪崩效应,无法响应新请求。 【不搞复杂的,量大就完事儿了】

DDos

攻击特点:

  • 直接访问 IP
  • 任意 API
  • 消耗大量带宽(耗尽)

DDos Demo

截屏2022-08-01 13.18.58.png

中间人攻击

截屏2022-08-01 13.19.29.png

防御篇

XSS

截屏2022-08-01 13.20.14.png XSS--现成工具

前端:

  • 主流框架默认防御 XSS
  • google-closure-library 服务端(Node)
  • DOMPurify

插播:Same-origin Policy

截屏2022-08-01 13.23.00.png

Content Security Policy(CSP)

截屏2022-08-01 13.23.59.png

CSP

截屏2022-08-01 13.24.39.png

CSRF的防御

截屏2022-08-01 13.25.11.png

CSRF--token

截屏2022-08-01 13.25.38.png

截屏2022-08-01 13.26.06.png

CSRF--iframe 攻击

截屏2022-08-01 13.26.46.png

SameSite Cookie

  • 依赖 Cookie 的第三方服务怎么办?
  • 内嵌一个 X 站播放器,识别不了用户登陆态,发不了弹幕

SameSite vs CORS

截屏2022-08-01 13.29.10.png

SameSite Cookie

截屏2022-08-01 13.29.44.png

防御 CSRF 的正确姿势

Case by case防御? 截屏2022-08-01 13.30.46.png

Injection

  • 找到项目中查询 SQL 的地方
  • 使用 prepared statement 截屏2022-08-01 13.32.07.png

Injection beyond SQL

截屏2022-08-01 13.33.21.png

Regex Dos

截屏2022-08-01 13.34.01.png

Logical Dos

截屏2022-08-01 13.34.30.png

DDos

截屏2022-08-01 13.34.57.png

传输层--防御中间人

截屏2022-08-01 13.35.38.png

HTTPS的一些特性

  • 可靠性:加密
  • 完整性:MAC 验证
  • 不可抵赖性:数字签名 截屏2022-08-01 13.37.06.png

HTTPS--完整性

截屏2022-08-01 13.37.29.png

插播:数字签名

截屏2022-08-01 13.38.29.png

HTTPS--不可抵赖:数字签名

截屏2022-08-01 13.39.05.png

HTTP Strict-Transport-Security(HSTS)

截屏2022-08-01 13.40.57.png

尾声

  • 安全无小事
  • 使用的依赖(npm package,甚至是NodeJS)可能成为最薄弱的一环
  • left-pad事件
  • eslint-scope事件
  • event-stream事件 npm install除了带来了黑洞,还可以带来漏洞

推荐读物

什么是DDOS攻击

aws.amazon.com/cn/shield/d…

SameSite那些事

imnerd.org/samesite.ht…