Koa简介

大家好！！今天呢玖玖passion带来的分享是node.js的koa这款轻量级的框架。Koa 是一个由 Express 框架的原作者团队设计的 Node.js web 开发框架，它旨在提供一个更为现代、灵活和极简的方式来构建 web 应用和 API 服务。Koa 的设计充分利用了 ES6 的 async/await 功能，这使得编写异步代码变得更加清晰和直观。Koa有着轻量级的特点。Koa 是一个非常轻量的框架，没有捆绑任何中间件，这意味着开发者可以根据具体需求自由选择和添加中间件。话不多说我们进入正题吧！!

原生node web服务

想要了解Koa框架我们先了解下原生的node 来构建web服务！！先初始化为后端项目

然后呢安装koa框架

我们现在用原生的node写一个web服务,请看如下：

那我们看看用koa写的吧！

通过对比我们一眼就能发现用koa框架写代码量明显变少了！！我们接着往下聊!!

我们可以看看以上代码,会发现main函数中有ctx这个形参！！当我们调用app.use(main)这个后main函数会自动接收一个ctx形参。这个参数代表了当前请求的上下文。ctx 对象是 KoaContext 类型的一个实例，它继承自 BaseContext，并且包含了所有与请求和响应相关的信息。既然如此我们打印出ctx来看看它的真实面貌吧！！

以下便是console.log打印出来的结果

{
  request: {
    method: 'GET',
    url: '/',
    header: {
      host: 'localhost:3000',
      connection: 'keep-alive',
      'sec-ch-ua': '"Microsoft Edge";v="117", "Not;A=Brand";v="8", "Chromium";v="117"',
      'sec-ch-ua-mobile': '?0',
      'sec-ch-ua-platform': '"Windows"',
      'upgrade-insecure-requests': '1',
      'user-agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/117.0.0.0 Safari/537.36 Edg/117.0.2045.31',
      accept: 'text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.7',
      'sec-fetch-site': 'none',
      'sec-fetch-mode': 'navigate',
      'sec-fetch-user': '?1',
      'sec-fetch-dest': 'document',
      'accept-encoding': 'gzip, deflate, br',
      'accept-language': 'zh-CN,zh;q=0.9,en;q=0.8,en-GB;q=0.7,en-US;q=0.6',
      cookie: 'Idea-8e57c68d=551b4264-67fb-45b6-b746-787170b9a680; Webstorm-513a1854=c949a833-d636-4ce2-8b6d-bc389a089dfa',
      'if-none-match': 'W/"6de-TcGKzxKooTCrbMURN8ddCzAN9eU"'
    }
  },
  response: {
    status: 404,
    message: 'Not Found',
    header: [Object: null prototype] {}
  },
  app: { subdomainOffset: 2, proxy: false, env: 'development' },
  originalUrl: '/',
  req: '<original node req>',
  res: '<original node res>',
  socket: '<original node socket>'
}
{

我们可以分析得出打印出来的是一个对象,这个对象呢包括了request对象,和response对象另外还有原生的res和req。也就是说这个koa上下文对象集成了原生node里边的req和res两个形参的能力。我们继续剖析request和reponse，request里边有method,url,header属性。reponse有有status,message,header属性。那么这样的话我们就可以通过ctx来访问这些属性啦！！

koa实战

koa呢作为一款轻量级的框架很多方法帮我们封装的很优雅,那么我们就通过实际的例子来看看它的优雅之处吧！！

const main=(ctx)=>{  
ctx.res.end('hello koa!!')  
}

或者
const main=(ctx)=>{  
ctx.response.body='hello koa!!'  
}
或
const main=(ctx)=>{  
ctx.body='hello koa!!'  
}

它们输出的结果是一样的。可见koa框架为了方便我们书写代码,打造的越来越轻便和简洁！！

koa-route

接下来我们引入koa路由,接下来的例子让我们来看看koa框架实现后端的操作吧！！

const Koa=require('koa');  
const app=new Koa()  
const router=require('koa-route')  
  
const main=(ctx)=>{  
ctx.type='html'  
ctx.body='<h2>首页<h2></h2>'  
}  
const about=(ctx)=>{  
ctx.type='html'  
ctx.body='<a href="/">关于页面,点击去首页</a>'  
}  
app.use(router.get('/',main))  
app.use(router.get('/about',about))  
app.listen(3000,()=>{  
console.log('listening on port 3000')  
})

由以上的代码我们可以直观地看出当使用app.use(router.get('/',main)) 时意味着当前端请求的是根路径下的时候会调用main函数，当前端请求的是about这个路径的时候会调用about这个函数。其中ctx.body为响应体,给前端返回数据。ctx.type为响应头的类型！！ app.use(router.get('/about',about))

洋葱模型视角看koa

Koa 的洋葱模型是指 Koa 中间件的执行方式，这种模型在很多 Node.js Web 框架中都有应用，比如 Express 和 Connect。洋葱模型这个名字来源于中间件执行过程的形状，就像剥洋葱一样，一层一层地执行下去，然后再一层一层地返回。话不多我们来看看例子吧！！


const Koa=require('koa');  
const app=new Koa()  
const one=(ctx,next)=>{//中间件  
console.log('1');  
next()  
console.log('2');  
}  
const two=(ctx,next)=>{  
console.log('3');  
next()  
console.log('4');  
}  
const three=(ctx)=>{  
console.log('5');  
  
console.log('6');  
}  
app.use(one)  
app.use(two)  
app.use(three)  
app.listen(3000,()=>{  
console.log('listening on port 3000')  
})

首先呢在koa框架中一个函数后边的函数的执行依赖于这个函数有没有next()的调用,以及是否有next形参。如果没有的话后边的函数便不会执行！！我们打印出结果看看吧！！

我们看着这个结果是不是感受到了递归？对的koa的洋葱模型便是运用了递归！！它的流程是：### 执行流程：

请求到达：当一个 HTTP 请求到达时，它会从最外层的中间件开始执行，依次向内层传递。
调用 next() ：在每个中间件内部，可以通过调用 next() 函数来将控制权传递给下一个中间件。如果没有更多的中间件，那么请求会到达“中心”。
响应生成：一旦到达中心，或者某个中间件决定不再调用 next()，响应就开始构建。
响应返回：响应构建完成后，控制权开始向外层返回，在返回的过程中，中间件可以进一步处理响应，例如添加响应头或修改响应体。
今天的故事就分享到这里啦！
请大家点赞加转发和收藏~~