使用Koa构建Web应用的入门实践
环境搭建与基础服务
首先创建项目目录并完成初始化：
mkdir koa-demo && cd koa-demo
npm init -y
安装核心依赖：
npm install koa koa-router --save
创建入口文件 server.js，搭建基础服务：
const Koa = require('koa');
const Router = require('koa-router');
const webApp = new Koa();
const routeHandler = new Router();
// 定义路由
routeHandler.get('/item/:itemId', (ctx) => {
ctx.body = '商品详情页';
// 请求信息获取
ctx.request.query; // 查询参数对象
ctx.request.querystring; // 查询参数字符串
ctx.request.href; // 完整请求地址
// 动态路由参数
console.log(ctx.params); // 输出: { itemId: 'xxx' }
});
// 注册路由组件
webApp.use(routeHandler.routes());
webApp.use(routeHandler.allowedMethods());
webApp.listen(3000, () => {
console.log('服务运行于 3000 端口');
});
中间件机制
中间件是Koa的核心特性，用于在请求处理的不同阶段执行逻辑：
// 日志记录中间件
webApp.use(async (ctx, next) => {
const startTime = Date.now();
await next(); // 移交控制权给下一个中间件
const duration = Date.now() - startTime;
console.log(`${ctx.method} ${ctx.url} - ${duration}ms`);
});
// 异常处理中间件
webApp.use(async (ctx, next) => {
await next();
if (ctx.status === 404) {
ctx.body = { error: '资源未找到' };
}
});
模板渲染集成
安装模板引擎支持：
npm install koa-views ejs --save
配置并使用：
const render = require('koa-views');
// 注册模板中间件
webApp.use(render(__dirname + '/templates', {
extension: 'ejs'
}));
// 路由中渲染页面
routeHandler.get('/dashboard', async (ctx) => {
await ctx.render('dashboard', {
pageTitle: '管理后台',
userList: ['李明', '王芳', '张伟'],
score: 85
});
});
模板文件 templates/dashboard.ejs 示例：
<h1><%= pageTitle %></h1>
<!-- 数据遍历 -->
<ul>
<% userList.forEach(function(name) { %>
<li><%= name %></li>
<% }); %>
</ul>
<!-- 条件渲染 -->
<% if (score >= 60) { %>
<p>成绩合格</p>
<% } else { %>
<p>需要补考</p>
<% } %>
<!-- 原始HTML输出 -->
<%- rawHtmlContent %>
模板复用与全局数据
引入公共模块：
<%- include('components/navbar') %>
通过中间件注入全局状态：
webApp.use(async (ctx, next) => {
ctx.state = {
siteName: '技术博客',
currentYear: new Date().getFullYear()
};
await next();
});
Cookie管理
Cookie配置选项说明：
| 属性 | 作用 |
|---|---|
| maxAge | 有效期毫秒数 |
| expires | 具体过期时间 |
| path | 生效路径，默认根路径 |
| httpOnly | 限制客户端脚本访问，默认开启 |
| secure | 仅HTTPS传输 |
读写操作：
routeHandler.get('/login', (ctx) => {
// 设置Cookie
ctx.cookies.set('sessionToken', 'abc123xyz', {
maxAge: 24 * 60 * 60 * 1000, // 一天
path: '/admin',
httpOnly: true
});
ctx.body = '登录成功';
});
routeHandler.get('/profile', (ctx) => {
// 读取Cookie
const token = ctx.cookies.get('sessionToken');
ctx.body = { token };
});
注意：Koa原生不支持中文Cookie值，需先进行Base64编码处理。
Session会话管理
安装会话模块：
npm install koa-session --save
配置与使用：
const session = require('koa-session');
// 签名密钥
webApp.keys = ['your-secret-key-here'];
const sessionConfig = {
key: 'sid', // Cookie键名
maxAge: 86400000, // 24小时过期
autoCommit: true,
overwrite: true,
httpOnly: true, // 服务端独占
signed: true, // 签名防篡改
rolling: false,
renew: false, // 快过期时自动续期
secure: false // 开发环境关闭
};
webApp.use(session(sessionConfig, webApp));
routeHandler.post('/login', (ctx) => {
// 存储会话数据
ctx.session.nickname = '开发者小王';
ctx.session.role = 'editor';
ctx.body = { success: true };
});
routeHandler.get('/info', (ctx) => {
// 获取会话数据
ctx.body = {
user: ctx.session.nickname,
permission: ctx.session.role
};
});
