XSS 攻击案例

今天，我们来谈谈 XSS 攻击。

XSS 是什么

XSS 攻击指的是攻击者通过在受信任的网站上注入恶意的脚本，使得用户的浏览器在访问该网站时执行这些恶意脚本，从而导致信息泄露等安全问题。

XSS 英文名 Cross-Site-Scripting，即跨站脚本。为什么不叫 CSS 呢？因为 CSS 的缩写已经被 Cascading Style Sheets，即层叠样式表占用。

XSS 分类和演示

XSS 攻击主要分成三类：DOM 型 XSS 攻击、反射型 XSS 攻击和存储型 XSS 攻击。

我们接下来需要演示下 XSS 攻击，我们做点前期准备。

案例的演示环境: macOS Monterey - Apple M1 node version - v14.18.1 Visual Studio Code 及其 Live Server 插件

首先，我们添加个 hostname, 方便测试，当然你可以直接使用 ip 地址测试。

通过 sudo vim /etc/hosts 添加 127.0.0.1 a.example.com 的映射：

本文所有的案例通过 SSR 应用进行演示。

DOM 型 XSS 攻击

DOM 型 XSS 攻击利用了前端 Javascript 在浏览器中动态操作 DOM 的特性。DOM 型 XSS 攻击的原理是攻击者通过注入恶意代码或者脚本到网页中的 DOM 元素中，然后通过浏览器执行这些恶意的代码。

案例，如下：

代码语言：javascript复制

const Koa = require('koa');
const Router = require('koa-router');
const views = require('koa-views');
const path = require('path');

const app = new Koa();
const router = new Router();

app.use(
  views(path.join(__dirname, 'views'), {
    extension: 'ejs'
  })
);

router.get('/', async (ctx) => {
  await ctx.render('index', {
    xss: '<script>alert("XSS")</script>',
    content: 'DOM - XSS Attack'
  })
});

app.use(router.routes());
app.listen(3000, () => {
  console.log("listening on http://localhost:3000");
})

上面