koa2实现网站csrf防御
koa2实现网站csrf防御
发布于 2023-01-11 20:53:41
什么是csrf攻击？
csrf/xsrf又叫跨站请求伪造。
先说常见的登陆鉴权： 用户在你的网站登陆后，一般把登陆凭证（token）存储在cookie里，之后每次调接口都会自动携带，后端根据这条cookie鉴权，判定是登陆状态，进而允许进行安全操作。
虽然这种鉴权方式最为简便，但存在一种安全隐患，就是csrf。
csrf攻击者会利用http请求自动携带cookie的机制，在用户登陆后，引导用户点击它的攻击链接，进而拿到用户的token去进行恶意请求，比如购买商品，虚拟货币转账......造成的问题包括：个人隐私泄露以及财产安全。
Description
防御csrf攻击
思路：
由于csrf攻击者只能拿到cookie去干坏事，但它无法知道cookie里有什么，也拿不到其他有效信息。我们只需要除cookie外再加一道它做不到的验证就可以了。
前端首次加载页面的时候，调接口让后端植入一条csrfToken到cookie里。然后前端每次请求从cookie里取出然后放到请求头里给后端传输。
后端将植入给前端的csrfToken存储在session，然后一些安全接口（一般是除了get请求外的接口），请求时，需要先进行csrf比对，取出request请求头里的csrfToken和自己session里的csrfToken进行比对，完全一致才放行
代码实现
前端（react）
1//App.tsx
2//根组件，判断cookie里有没有csrfToken，没有就请求后端种植
3 useEffect(() => {
4 if (!cookie.get("csrf_token")) {
5 request("/all/getCsrfToken");
6 }
7 }, []);1//request.ts
2//axios请求拦截器内置了csrf方法，如下配置即可自动取出cookie里的csrf并放到请求头
3request.interceptors.request.use((config: any) => {
4 // 开启顶部加载进度条
5 Nprogress.start();
6
7 config.xsrfHeaderName = "X-CSRF-TOKEN";
8 config.xsrfCookieName = "csrf_token";
9
10 return config;
11});后端（koa2）
后端利用koa-csrf中间件实现
漫思
