资讯专栏INFORMATION COLUMN

iKcamp团队制作|基于Koa2搭建Node.js实战(含视频)☞ 中间件用法

Alfred / 356人阅读

中间件用法——讲解 Koa2 中间件的用法及如何开发中间件 ?? iKcamp 制作团队

原创作者:大哼、阿干、三三、小虎、胖子、小哈、DDU、可木、晃晃
文案校对:李益、大力萌、Au、DDU、小溪里、小哈
风采主播:可木、阿干、Au、DDU、小哈
视频剪辑:小溪里
主站运营:给力xi、xty
教程主编:张利涛

视频地址:https://www.cctalk.com/v/15114357763623

文章 middleware 中间件
正是因为中间件的扩展性才使得 Koa 的代码简单灵活。

app.js 中,有这样一段代码:

app.use(async (ctx, next)=>{
  await next()
  ctx.response.type = "text/html"
  ctx.response.body = "

Hello World

" })

它的作用是:每收到一个 http 请求,Koa 都会调用通过 app.use() 注册的 async 函数,同时为该函数传入 ctxnext 两个参数。而这个 async 函数就是我们所说的中间件。

下面我们简单介绍一下传入中间件的两个参数。

ctx

ctx 作为上下文使用,包含了基本的 ctx.requestctx.response。另外,还对 Koa 内部对一些常用的属性或者方法做了代理操作,使得我们可以直接通过 ctx 获取。比如,ctx.request.url 可以写成 ctx.url

除此之外,Koa 还约定了一个中间件的存储空间 ctx.state。通过 state 可以存储一些数据,比如用户数据,版本信息等。如果你使用 webpack 打包的话,可以使用中间件,将加载资源的方法作为 ctx.state 的属性传入到 view 层,方便获取资源路径。

next

next 参数的作用是将处理的控制权转交给下一个中间件,而 next() 后面的代码,将会在下一个中间件及后面的中间件(如果有的话)执行结束后再执行。

注意: 中间件的顺序很重要!

我们重写 app.js 来解释下中间件的流转过程:

// 按照官方示例
const Koa = require("koa")
const app = new Koa()

// 记录执行的时间
app.use(async (ctx, next) => {
  let stime = new Date().getTime()
  await next()
  let etime = new Date().getTime()
  ctx.response.type = "text/html"
  ctx.response.body = "

Hello World

" console.log(`请求地址: ${ctx.path},响应时间:${etime - stime}ms`) }); app.use(async (ctx, next) => { console.log("中间件1 doSoming") await next(); console.log("中间件1 end") }) app.use(async (ctx, next) => { console.log("中间件2 doSoming") await next(); console.log("中间件2 end") }) app.use(async (ctx, next) => { console.log("中间件3 doSoming") await next(); console.log("中间件3 end") }) app.listen(3000, () => { console.log("server is running at http://localhost:3000") })

运行起来后,控制台显示:

server is running at http://localhost:3000

然后打开浏览器,访问 http://localhost:3000,控制台显示内容更新为:

server is running at http://localhost:3000
中间件1 doSoming
中间件2 doSoming
中间件3 doSoming
中间件3 end
中间件2 end
中间件1 end
请求地址: /,响应时间:2ms

从结果上可以看到,流程是一层层的打开,然后一层层的闭合,像是剥洋葱一样 —— 洋葱模型。

此外,如果一个中间件没有调用 await next(),会怎样呢?答案是『后面的中间件将不会执行』。

修改 app.js 如下,我们去掉了第三个中间件里面的 await

const Koa = require("koa")
const app = new Koa()

// 记录执行的时间
app.use(async (ctx, next)=>{
  let stime = new Date().getTime()
  await next()
  let etime = new Date().getTime()
  ctx.response.type = "text/html"
  ctx.response.body = "

Hello World

" console.log(`请求地址: ${ctx.path},响应时间:${etime - stime}ms`) }); app.use(async (ctx, next) => { console.log("中间件1 doSoming") await next(); console.log("中间件1 end") }) app.use(async (ctx, next) => { console.log("中间件2 doSoming") // 注意,这里我们删掉了 next // await next() console.log("中间件2 end") }) app.use(async (ctx, next) => { console.log("中间件3 doSoming") await next(); console.log("中间件3 end") }) app.listen(3000, () => { console.log("server is running at http://localhost:3000") })

重新运行代码后,控制台显示如下:

server is running at http://localhost:3000
中间件1 doSoming
中间件2 doSoming
中间件2 end
中间件1 end
请求地址: /,响应时间:1ms

与我们的预期结果『后面的中间件将不会执行』是一致的。

下一篇:我们将学习下如何响应浏览器的各种请求。

上一篇:iKcamp新课程推出啦~~~~~iKcamp团队制作|基于Koa2搭建Node.js实战(含视频)☞ 环境准备
推荐: 翻译项目Master的自述: 干货|人人都是翻译项目的Master

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/92309.html

相关文章

  • iKcamp团队制作基于Koa2搭建Node.js实战项目教学(视频)☞ 环境准备

    安装搭建项目的开发环境 视频地址:https://www.cctalk.com/v/15114357764004 showImg(https://segmentfault.com/img/remote/1460000012470016?w=1214&h=718); 文章 Koa 起手 - 环境准备 由于 koa2 已经开始使用 async/await 等新语法,所以请保证 node 环境在 7.6...

    bang590 评论0 收藏0
  • 开始连载啦~每周2更共11堂iKcamp课|基于Koa2搭建Node.js实战项目教学(视频)|

    摘要:玩转同时全面掌握潮流技术采用新一代的开发框架更小更富有表现力更健壮。融合多种常见的需求场景网络请求解析模板引擎静态资源日志记录错误请求处理。结合语句中转中间件控制权,解决回调地狱问题。注意分支中的目录为当节课程后的完整代码。 ??  与众不同的学习方式,为你打开新的编程视角 独特的『同步学习』方式 文案讲解+视频演示,文字可激发深层的思考、视频可还原实战操作过程。 云集一线大厂...

    B0B0 评论0 收藏0
  • 【完结汇总】iKcamp出品基于Koa2搭建Node.js实战共十一堂课(视频)

    摘要:云集一线大厂有真正实力的程序员团队云集一线大厂经验丰厚的码农,开源奉献各教程。融合多种常见的需求场景网络请求解析模板引擎静态资源日志记录错误请求处理。结合语句中转中间件控制权,解决回调地狱问题。注意分支中的目录为当节课程后的完整代码。 ??  与众不同的学习方式,为你打开新的编程视角 独特的『同步学习』方式 文案讲解+视频演示,文字可激发深层的思考、视频可还原实战操作过程。 云...

    sPeng 评论0 收藏0
  • iKcamp团队制作基于Koa2搭建Node.js实战视频)☞ 路由koa-router

    路由koa-router——MVC 中重要的环节:Url 处理器 ?? iKcamp 制作团队 原创作者:大哼、阿干、三三、小虎、胖子、小哈、DDU、可木、晃晃 文案校对:李益、大力萌、Au、DDU、小溪里、小哈 风采主播:可木、阿干、Au、DDU、小哈 视频剪辑:小溪里 主站运营:给力xi、xty 教程主编:张利涛 视频地址:https://www.cctalk.com/v/151...

    netmou 评论0 收藏0
  • iKcamp基于Koa2搭建Node.js实战视频)☞ HTTP请求

    POST/GET请求——常见请求方式处理 ?? iKcamp 制作团队 原创作者:大哼、阿干、三三、小虎、胖子、小哈、DDU、可木、晃晃 文案校对:李益、大力萌、Au、DDU、小溪里、小哈 风采主播:可木、阿干、Au、DDU、小哈 视频剪辑:小溪里 主站运营:给力xi、xty 教程主编:张利涛 视频地址:https://www.cctalk.com/v/15114357765870 ...

    张利勇 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<