当前位置：首页 > wzjs >正文

网站建设项目验收付款百度手游app下载

wzjs 2025/8/6 16:13:58

网站建设项目验收付款,百度手游app下载,dz还是wordpress,wordpress 更换空间阶段目标： 掌握Koa的高级功能，能够构建一个功能较为完整的Web应用。学习内容： 路由管理：学习如何使用koa-router中间件来管理路由，实现不同路径的请求处理。模板引擎：了解如何使用模板引擎（如…

阶段目标：

掌握Koa的高级功能，能够构建一个功能较为完整的Web应用。

学习内容：

路由管理：学习如何使用koa-router中间件来管理路由，实现不同路径的请求处理。

模板引擎：了解如何使用模板引擎（如ejs、pug）来渲染HTML页面。

静态文件服务：学习如何使用koa-static中间件来提供静态文件服务。

错误处理：掌握如何在Koa中处理错误，包括全局错误捕获和中间件中的错误处理。

数据库集成：学习如何在Koa中集成数据库（如MySQLB），并实现基本的CRUD操作。（用sequelize+mysql实现）

第二阶段分为上中下篇，本篇文章是上篇，介绍第1-2点内容，中篇介绍第3-4的内容，下篇介绍第5的内容：数据库集成。

一、路由管理

在Koa中，路由管理通常使用koa-router中间件来实现。koa-router是一个强大的路由管理工具，支持RESTful API和页面路由。

1、安装koa-router

npm install koa-router

2、代码示范

const Koa = require('koa');
const Router = require('koa-router');
const bodyParser = require('koa-bodyparser'); // 导入koa-bodyparser
const { name } = require('ejs');const app = new Koa();
const router = new Router();// 使用bodyParser中间件解析请求体
app.use(bodyParser());// 定义路由
router.get('/', async (ctx) => {ctx.body = 'Welcome to the home page!';
});router.get('/about', async (ctx) => {ctx.body = 'This is the about page.';
});router.post('/submit', async (ctx) => {const data = ctx.request.body; // 获取请求体数据console.log("获得请求体数据>>>>",data);//   ctx.body = `Received data: ${JSON.stringify(data)}`;ctx.body = data;
});// 新增http方法
let obj={name:'zhangsan',age:18
}
router.put('/update', async (ctx) => {const data = ctx.request.body;console.log("获得请求体数据>>>>",data);
//   比如将obj的name和age更新为请求体的name和ageobj.name=data.name;obj.age=data.agectx.body = obj;
});
// 使用路由中间件
app.use(router.routes()).use(router.allowedMethods());app.listen(3000, () => {console.log('Server is running at http://localhost:3000');
});

3、测试

3.1、访问初始化页面

3.2、访问about页面

3.3、用api工具测试post和put请求

测试post请求

点击发送后，在终端查看打印结果

测试put请求

比如这里我定义了一个obj对象，我在发送put请求的时候，将obj两个属性的值进行修改，然后返回给前端。

点击发送

注意：本篇暂时不介绍delete方法，后续介绍”数据库集成” 的时候会演示delete方法。

二、模板引擎

Koa支持多种模板引擎，如ejs、pug等。这里我们以ejs为例。

1、安装ejs和koa-ejs

npm install ejs koa-ejs

2、代码示范

2.1、demo2.js

const Koa = require('koa');
const ejs = require('koa-ejs');
const Router = require('koa-router');const app = new Koa();
const router = new Router();// 配置ejs模板引擎
ejs(app, {root: __dirname + '/views', // 模板文件夹路径layout: false, // 是否使用布局文件viewExt: 'html', // 模板文件扩展名cache: false, // 是否缓存模板debug: false // 是否开启调试模式
});// 定义路由
router.get('/', async (ctx) => {await ctx.render('index', { title: 'Home Page' });
});router.get('/about', async (ctx) => {await ctx.render('about', { title: 'About Page' });
});// 使用路由中间件
app.use(router.routes()).use(router.allowedMethods());app.listen(3000, () => {console.log('Server is running at http://localhost:3000');
});

2.2、在views文件夹中创建两个模板文件

PS:注意文件的目录以及位置

这里为了方便演示，就不涉及复杂的html代码

index.html

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title><%= title %></title>
</head><body><h1>Welcome to the <%= title %></h1>
</body></html>

about.html

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title><%= title %></title>
</head><body><h1>This is the <%= title %></h1>
</body></html>

3、测试

启动服务器 node demo2.js

注意：尽可能将不同代码示范写在不同文件下。

比如路由管理的代码示范，我就写在state2/demo1.js
模版引擎的代码示范，我就写在state2/demo2.js
模板引擎用到的view文件夹以及views/index.html和views/about.html。

知道自己的代码写在什么位置，启动服务器的时候就不会混淆。