百度了一遍，基本都是千篇一律，都是从 captchapang 扣的，我当然也是。
但前端与后台的接口基本没有怎么实现，wtf
后端代码
import captchapng from ‘captchapng‘;class Captchas { ?constructor() { ?} ?//验证码 ?static async getCaptchas(ctx) { ???const cap = parseInt(Math.random() * 9000 + 1000); ???const p = new captchapng(80, 30, cap); ???p.color(0, 0, 0, 0); ???p.color(80, 80, 80, 255); ???const base64 = p.getBase64(); ???//官网少了这一步 ???ctx.cookies.set(‘captcha‘, cap, {maxAge: 360000, httpOnly: true}); ???ctx.status = 200 ???ctx.body = { ?????code: ‘data:image/png;base64,‘ + base64 ???} ?}}export default Captchas//官网少了这一步ctx.cookies.set(‘captcha‘, cap, {maxAge: 360000, httpOnly: true});
这样子你生成的img验证图片包含的数字就放在你的cookies了，在提交的时候，从前台的传参，跟cookies做个对比
async Login(ctx) { ???let cap = ctx.cookies.get(‘captcha‘) ???let {username, password,captcha} = ctx.request.body ???console.log(cap); ???console.log(captcha); ???if (cap!=captcha){ ?????ctx.status = 401; ?????ctx.body = { ?????????message: ‘验证码错误‘ ?????} ?????return ???}