Web 安全 | 青训营假如你是一个攻击者，该如何攻击假如你是一个防御者，该如何防御 Cross-Site Scrip

假如你是一个攻击者，该如何攻击

假如你是一个防御者，该如何防御

Cross-Site Scripting（XSS）跨站脚本攻击

攻击方式

脚本被注入页面，在页面中执行

XSS主要利用了盲目信任用户的提交内容：

特点

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

demo

public async submit(ctx){
    const {content,id} = ctx.request.body;
     await = db.save({
         content,id
     })
   }
   
public async render(ctx){
    const {content}  = await db.query({
        id:ctx.query.id
    })
       ctx.body = `<div>${content}</div>`
}

服务端，未对传来的数据做判断，返回的时候原样返回，如果有恶意脚本攻击，则会在页面中执行这个脚本

存储型XSS攻击。

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

反射性XSS

不涉及数据库
恶意攻击+执行，全在浏览器执行

巧妙攻击

先看一段代码

<noscript><p title="</noscript><img src=x onerror=alert(1)>">

但是在浏览器端进行解析之后

<div>
    <noscript><p title="</noscript>
    <img src=x onerror=alert(1)>
</div>

这样就能把代码嵌入到页面中了

CSRF 跨站伪造请求

点击链接就会使得自己的信息被带到其他网站上

<a href="https://bank.com/transfer?to=hacker&amount=100">点击抽奖</a>

<img style="display:none;" src="https://bank.com/transfer?to=hacker&amount=100"  />

SQL注入

public async renderForm(ctx){
    const { username,form_id} = ctx.query;
    const result = await sql.query(`
    SELECT A,B,C from table
    WHERE username = ${suername}
    AND form_id = ${form_id}
    `)
}

Injection demo2 --读取+修改

DOS

通过某种方式，导致服务器资源被消耗，来不及响应更多请求，导致请求挤压，进而雪崩效应

基于正则表示的Dos

DDOS

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

中间人攻击

防御措施

xss

永远不信任，用户的提交内容

不要将用户的提交内容直接转化为DOM

现成工具

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

服务端（node）

DOMPurify

如果有需求是必须动态生成DOM

String -> DOM 一定做好转义，

如果允许用户上传SVG。则需要对SVG进行一次扫描，检测内部代码

对于自定义跳转链接：需要检测好内部代码

CSP

csp

那些源（域名）被认为是安全的
来自安全源的脚本可以执行。否则直接抛弃
对eval +inline script说不

CSRF的防御

CSRF---token

CSRF--iframe 攻击

在iframe中可以发送同源请求，

在页面头部可以加上：X-Frame-Option ：DENY/SAMEORIGIN

Same-setCookie

Injection防御

找到项目查询SQL的地方
使用prepared statement

Web 安全 | 青训营

Cross-Site Scripting（XSS） 跨站脚本攻击