Web前端最全Koa 基础篇（二）—— 路由与中间件(1)，前端组件化架构实践

最后

如果你已经下定决心要转行做编程行业，在最开始的时候就要对自己的学习有一个基本的规划，还要对这个行业的技术需求有一个基本的了解。有一个已就业为目的的学习目标，然后为之努力，坚持到底。如果你有幸看到这篇文章，希望对你有所帮助，祝你转行成功。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

4. 基本使用

router.get(“/”,async ctx => {

ctx.body = “hello koa router”

})

完整代码：

const Koa = require(“koa”)

const router = require(“koa-router”)()

let app = new Koa()

router.get(“/”,async ctx => {

ctx.body = “hello koa router”

})

app.use(router.routes())

app.use(router.allowedMethods())

app.listen(3000)

运行项目，在浏览器访问本地3000端口，在页面上就会看到输出的语句。这就是最简单的路由。

获取查询字符串

其实，不知不觉的，在上面的例子中已经处理了一个 GET 请求。那么，如何获取到 GET 请求中的查询字符串呢？

示例：

router.get(“/news”,async ctx => {

console.log(ctx.query)

ctx.body = “hello koa router”

})

很简单，通过 ctx.query 就可以获取到所有的查询字符串（被封装为一个对象）。

动态路由匹配

通过语法 ：param 来指定动态路由。

示例：

router.get(“/news/:id”,async ctx => {

console.log(ctx.params)

ctx.body = “hello koa router”

})

通过 ctx.params 就可以获取到所有动态路由参数（被封装为一个对象）。

处理 post 请求

处理 post 请求并不是一件困难的事，直接使用 router.post() 就可以处理了，问题就在于如何获取 post 请求的请求体。

在原生的 node.js 中，post 请求提交的数据是由一个个数据块来组成的，所以在接收的时候需要手动进行拼接，这无疑带来不友好的体验，所以，使用第三方中间件 koa-bodyparser 来进行请求体的解释。

1. 安装

npm install --save koa-bodyparser

2. 引入

const parser = require(“koa-bodyparser”)

app.use(parser())

3. 使用

router.post(“/login”,async (ctx,next) => {

console.log(ctx.request.body)

ctx.body = “login success”

})

通过 ctx.request.body 就可以获取到 post 请求体的内容了。

中间件

---

中间件就是匹配路由之前或匹配路由完成后做的一系列操作。

可以通过中间件来执行代码，修改请求和响应对象，调用堆栈中的下一个中间件。

应用级中间件

需求：在处理所有请求之前都要打印当前的时间。

显然，不可能在每个路由中都插入一段代码来完成这个工作，所以此时就需要用到中间件了。

示例：

app.use(async (ctx,next) => {

console.log(new Date())

await next()

})

router.get(“/news”,async (ctx,next) => {

console.log(“news”)

ctx.body = “this is news page”

})

router.get(“/home”,async (ctx,next) => {

console.log(“home”)

ctx.body = “this is home page”

})

在上面的例子中，通过一个 use 方法，作为所有路由的 “拦截器” ，在处理所有路由之前先执行了这个路由里面的逻辑。

路由中间件

只处理某个具体路由的中间件。

示例：

总结

技术学到手后，就要开始准备面试了，找工作的时候一定要好好准备简历，毕竟简历是找工作的敲门砖，还有就是要多做面试题，复习巩固。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

由之前先执行了这个路由里面的逻辑。

路由中间件

只处理某个具体路由的中间件。

示例：

总结

技术学到手后，就要开始准备面试了，找工作的时候一定要好好准备简历，毕竟简历是找工作的敲门砖，还有就是要多做面试题，复习巩固。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

[外链图片转存中…(img-3bt1v2TM-1715173296521)]