Web 开发的安全之旅 ｜ 青训营笔记

行下星暇
180 阅读4分钟

这是我参与「第五届青训营 」伴学笔记创作活动的第 10 天

一、本堂课重点内容：

Web 开发安全 - 攻击篇

  • Cross-Site Scripting(XSS)
  • Cross-site request forgery(CSRF)
  • Injection
  • Denial of Service(DoS)
  • Distributed DoS(DDoS)
  • 中间人攻击

Web 开发安全 - 防御篇

  • XSS 的防御
  • 防御 CSRF 的正确姿势
  • 防御 DoS
  • 防御 Injection
  • 防御中间人

二、详细知识点介绍：

1.Web 开发安全 - 攻击篇

1.1 Cross-Site Scripting(XSS)

XSS是跨栈调整攻击，在开发维护界面中攻击者把恶意调整方式注入。

image.png

后果：用户隐私泄露，用户的机器被当成挖矿的机器。

[XSS的利用部分]

  1. 盲目信任用户的提交内容
  2. String转化为了Dom
image.png

[XSS的特点]

  • 通常难以从UI上感知（暗地执行脚本)
  • 窃取用户信息(cookie/token)
  • 绘制UI(例如弹窗)，诱骗用户点击/填写表单

[XSS demo]

image.png

可以直接提交恶意脚本

image.png

[Stored XSS]

  • 恶意脚本被存在数据库中
  • 访问页面->读数据被攻击
  • 危害最大，对全部用户可见
image.png

这时如果这个网站有XSS，那么所有用户都会被攻击，会造成隐私泄露

[Reflected XSS]

  • 不涉及数据库
  • 从URL上攻击

[Reflected XSS Demo]

image.png

[DOM-based XSS]

  • 不需要服务器的参与
  • 恶意攻击的发起＋执行，全在浏览器完成

[DOM-based XSS Demo]

image.png

[Reflected vs DOM-based]

完成注入脚本的地方

image.png

[Mutation-based XSS]

  • 利用了浏览器渲染DOM的特性（独特优化)
  • 不同浏览器，会有区别(按浏览器进行攻击)

1.2 Cross-site request forgery(CSRF)

  • 在用户不知情的前提下
  • 利用用户权限(cookie)
  • 构造指定HTTP请求，窃取或修改用户敏感信息

[CSRF demo]

image.png

[CSRF--GET]

image.png

1.3 Injection

[注入攻击]

image.png

[demo 1]

  • 读取请求字段
  • 直接以字符串的形式拼接SQL语句
image.png

也包括：

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

[demo 2 执行]

image.png image.png

[demo 2 读取 + 修改]

image.png

[SSRF demo]

image.png
  • 请求【用户自定义】的callbackURL
  • web server通常有内网访问权限

1.4 Denial of Service(DoS)

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

[正则表达式]

  • 重复匹配时「?vs 「no ?」︰满足“一个“即可vs尽量多
image.png image.png

1.5 Distributed DoS(DDoS)

短时间内，来自大量僵尸设备的请求流量，服务器不能及时完成全部请求，导致请求堆积，进而雪崩效应，无法响应新请求。

[Logical Dos]

  • 耗时的同步操作
  • 数据库写入
  • SQL join
  • 文件备份
  • 循环执行逻辑
image.png

1.6 中间人攻击

  • 明文传输
  • 信息篡改不可知
  • 对方身份未验证
image.png

2.Web 开发安全 - 防御篇

1.1 XSS 的防御

  • 永远不信任用户的提交内容
  • 不要将用户提交内容直接转换成 DOM
image.png

[XSS--现成工具]

前端

  • 主流框架默认防御XSS
  • google-closure-library

服务端(Node)

  • DOMPurify

[XSS]

【用户需求】不讲武德，必须动态生成DOM

[String->Dom]

image.png

[上传svg]

image.png

[Blob动态生成script]

image.png

[自定义样式]

image.png

[CSP]

  • 哪些源(域名)被认为是安全的
  • 来自安全源的脚本可以执行，否则直接抛错
  • 对eval + inline script说 No、Ban
image.png

1.2 防御 CSRF 的正确姿势

image.png

[token]

image.png image.png

[iframe攻击]

image.png

[anti-pattern]

GET !== GET + POST

image.png

[避免用户信息被携带：SameSite Cookie]

image.png image.png

依赖Cookie的第三方服务怎么办?

  • 内嵌一个×站播放器，识别不了用户登录态，发不了弹幕
Set-Cookie: SameSite=None;Secure;

[SameSite vs CORS]

SameSite

  • Cookie发送
  • domain vs页面域名
  • “我跟你说个事儿出这屋我可就不认了”

CORS

  • 资源读写(HTTP请求)
  • 资源域名vs页面域名
  • 白名单

1.3 防御 DoS

[Regex DoS]

  • Code Review (X/(ab*)+/)
  • 代码扫描＋正则性能测试
  • X用户提供的使用正则

[DDoS]

过滤：

  • 流量治理
    • 负载均衡
    • API 网关
    • CDN

抗量：

  • 快速自动扩容
  • 非核心服务降级

1.4 防御 Injection

  • 找到项目中查询SQL的地方
  • 使用prepared statement
PREPARE q FROM 'SELECT user FROM users WHERE gender = ?';
SET @gender = 'female';
EXECUTE q USING @gender;
DEALLOCATE PREPARE q;

[beyond SQL]

  • 最小权限原则
    • sudo ll root
  • 建立允许名单＋过滤
    • rm
  • 对URL类型参数进行协议、域名、ip等限制
    • 访问内网

1.5 防御中间人

image.png

[HTTPS特性]

  • 可靠性:加密
  • 完整性:MAC验证
  • 不可抵赖性:数字签名
  • 明文X
  • 篡改X
  • 身份O
image.png

[HTTPS完整性]

image.png

[HTTPS--不可抵赖：数字签名]

image.png

[HTTPS--证书]

image.png image.png image.png

三、实践练习例子：

[Blob动态生成script]

const blob = new Blob(
[script],
{ type: "text/javascript"},
);
const url = new URL.create0bjectURL( blob );
const script = document.createElement("script");
script.src = url;

四、课后个人总结：

通过本章学习，我清楚了Web开发的安全威胁即攻击以及防护、防御，在XSS方面是比较繁杂的，了解web方面的攻击方式和防御手段在开发过程中是重要的，以便开发顺利完成、防止泄露信息等。

avatar
文章
阅读
粉丝