前言
這一篇將會講解 CSRF 的安裝使用,koa 官方也有提供相關的 csrf 套件,這一篇就來記錄一下該如何使用吧~
起手式
首先安裝 CSRF 套件
使用方式
安裝完畢後就引入套件,我們可以依照官方範例來撰寫,但是這邊要寫在 Route 中
1 2 3 4 5 6 7 8
| const CSRF = require('koa-csrf');
app.use(new CSRF({ invalidTokenMessage: 'Invalid CSRF token', invalidTokenStatusCode: 403, excludedMethods: [ 'GET', 'HEAD', 'OPTIONS' ], disableQuery: false }));
|
※這邊要注意一件事情 CSRF 功能必須依賴 session 套件,所以若沒有 session 套件將無法使用唷
接下來開啟 EJS,主要會新增一個隱藏欄位,並傳入 CSRF 等
EJS 版本
1
| <input type="hidden" name="_csrf" value="<%= csrf %>" />
|
PUG 版本
1
| input(type='hidden', name='_csrf', value=csrf)
|
route 修改
接下來必須針對 route 做一些修正,否則該怎麼傳入 CSRF?
![CSRF]()
接下來就可以看看隱藏欄位是否已經傳入 CSRF 囉
![CSRF]()
如果沒有 CSRF欄位那就會出現 CSRF 錯誤
![CSRF 錯誤]()
最後這邊補上 route 完整程式碼
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24
| const router = require('koa-router')(); const CSRF = require('koa-csrf'); const csrfMD = new CSRF({ invalidSessionSecretMessage: 'Invalid session secret', invalidTokenMessage: 'Invalid CSRF token', invalidTokenStatusCode: 403, });
router .get('/',csrfMD,async (ctx, next) => { ctx.cookies.set('cid','1234', cookieSet); await ctx.render('index', { title: 'EJS !', csrf: ctx.csrf }); }) .post('/post', csrfMD ,async (ctx, next) => { console.log(ctx.method); ctx.session.email = ctx.request.body.email; ctx.session.name = ctx.request.body.name; ctx.redirect('/'); })
module.exports = router;
|