本文演示如何使用 Node.js 的 Koa2 框架与 jsonwebtoken 库实现基于 Token 的身份认证。通过 Koa-jwt 中间件保护路由，前端利用 axios 发送请求并存储 Token。文章涵盖 Token 生成、携带 Token 发起受保护请求以及无效 Token 拦截的完整示例。
Node.js Koa2 JWT 认证流程概述
本文仅展示基础应用示例，关于 JSON Web Token 的具体原理与详细介绍，建议参考阮一峰老师的《JSON Web Token 入门教程》。
后端开发采用 Node.js 的 Koa2 框架，前端通过 axios 库发送 AJAX 请求。
工程目录与依赖安装
首先构建工程目录结构。
目录中，static 文件夹用于存放静态资源，views 文件夹存放前端模板文件，server.js 则包含后端核心代码。
接下来安装项目所需的依赖包。
"dependencies": {
"@koa/router": "^8.0.8",
"jsonwebtoken": "^8.5.1",
"koa": "^2.12.0",
"koa-bodyparser": "^4.3.0",
"koa-ejs": "^4.3.0",
"koa-jwt": "^4.0.0",
"koa-static": "^5.0.0",
"koa-views": "^6.2.2"
}在 server.js 文件中编写基础后端逻辑，由于此类示例较为常见，此处不再赘述基础配置代码。
const koa = require('koa');
const app = new koa();
const bodyParser = require('koa-bodyparser');
const router = require('@koa/router')();
const views = require('koa-views');
const static = require('koa-static');
const path = require('path');
app.use(bodyParser());
app.use(views(__dirname + '/views', {
map: { html: 'ejs' }
}));
app.use(static(path.join(__dirname, '/static')));
router.get('/', ctx => ctx.render('index'));
app
.use(router.routes())
.use(router.allowedMethods());
app.listen(8080, () => {
console.log('server is running at port 8080');
});后端 Token 生成与路由配置
在 const path = require('path'); 之后引入相关模块并添加如下代码：
const { sign } = require('jsonwebtoken');
const secret = 'demo';
const jwt = require('koa-jwt')({ secret });sign 方法用于生成 Token，其中 secret 为自定义密钥。JWT 库提供路由权限控制功能，会自动检查受限制资源的请求。
接下来定义登录路由 login。
router.post('/login', ctx => {
const { user } = ctx.request.body;
if (user && user.username === 'vip') {
let { username } = user;
const token = sign({ username }, secret, { expiresIn: '1h' });
ctx.body = {
message: 'GET TOKEN SUCCESS',
status: 200,
token
}
} else {
ctx.body = {
message: 'GET TOKEN FAILED',
status: 500
}
}
});如代码所示，当请求体中包含 user 对象且 username 为 'vip' 时，系统将生成 Token 并返回给前端。此处调用了前文定义的 sign 方法，第一个参数为用户信息，第二个参数为自定义密钥，第三个参数为配置选项，本例仅设置了过期时间。
随后创建受保护的路由 info。
router.get('/info', jwt, ctx => {
ctx.body = { message: `Welcome ${ctx.state.user.username}!`};
});与普通路由不同，此处引入了 jwt 中间件以进行权限校验。若验证失败，后续代码将不再执行。在生成 Token 后，用户名被存入 ctx.state.user 中，在此处可直接获取该信息。
在控制台输入 node server 命令以启动项目。
前端请求与 Token 验证测试
打开 index.html 文件，添加一个简单的表单和按钮，并引入 axios 库。
<form>
<input type="text" name="username">
<button id="submit">提交</button>
</form>
<button id="get">获取</button>
<script src="/vendors/axios.min.js"></script>首先实现登录逻辑。
document.querySelector('#submit').addEventListener('click', e => {
e.preventDefault();
const username = document.querySelector('input[name="username"]').value;
axios.post('/login', { user: { username } })
.then(response => {
response = response.data;
const { status, token, message } = response;
if (status === 200) {
localStorage.setItem('token', token);
}
alert(message);
})
.catch(error => alert(error.toString()));
});服务端生成的 Token 将存入 localStorage，以便后续请求使用。
当在输入框中输入 'vip' 并提交时，后端返回如下格式的数据：
message: "GET TOKEN SUCCESS" status: 200 token: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VybmFtZSI6InZpcCIsImlhdCI6MTU5MDMyOTkxOSwiZXhwIjoxNTkwMzMzNTE5fQ.PsyLYmr-pDxxdtrBEvMccVtBr9-xtOAHdZKen4FP34c"
接着添加获取受保护信息的逻辑。
document.querySelector('#get').addEventListener('click', e => {
e.preventDefault();
const instance = axios.create({ headers: { authorization: `Bearer ${localStorage.getItem('token')}` } });
instance.get('/info')
.then(response => {
response = response.data;
console.log(response)
alert(response.message);
})
.catch(error => alert(error.toString()));
});此处使用了 axios.create 方法，该方法允许在请求头中附加 Token 信息。从 localStorage 获取 Token 并拼接成 authorization: Bearer token 格式，随后发送 GET 请求。
此时点击获取按钮，控制台将提示：
这证明 Token 有效，请求被成功处理。
若清除 Application 中的 localStorage 记录后再次点击获取按钮，提示变为：
这表明 Token 验证拦截机制生效。
完整示例代码可在我的 GitHub 仓库中查看并下载。
关于 Node.js 使用 Token 进行认证的简单示例介绍至此，更多相关 Node.js 使用 Token 认证内容请搜索本站以前的文章或继续浏览下面的相关文章，希望大家以后多多支持本站！