浅析koa路由及其中间件

2023-10-05 18:26:22

文章目录

Koa路由
koa动态路由
中间件

Koa路由

什么是路由？

一路径加一方法（路径URL+特定HTTP方法）,也就是说路由是根据不同的URL地址，加载不同的页面并实现不同的功能

路由的安装

Koa中的路由我们需要安装koa-router路由模块来实现，在cmd中输入如下指令

安装指令：npm install --save koa-router

路由的匹配

安装完成后,我们进行路由的匹配，主要分为三步：

引入所需模块
规划路由
启动路由

先看第一步：引入所需模块

var Koa=require(“koa”);              //*引入koa框架*

var router=require(“koa-router”);    //*引入路由模板*

var app=new koa();

再看一下第三步: 启动路由

app.use(router.routes())             //*使用router.routes()必须先定义好它的routes*

app.use(router.allowedMethods())     //*可配置可不配置，官方文档的推荐用法*

具体的定义也就是 规划路由

router.get('/',async(ctx)=>{
    ctx.body="首页";
})
router.get('/news',async(ctx)=>{
    ctx.body="新闻页面";
})

①这里ctx是context的缩写，在中文翻译中是上下文的意思，我们可以把它理解为request和response沟通的环境，req和res这两个属性是之前express框架使用的方式，现在koa把它们都封装到ctx中
②body是http协议中的响应体，header是指响应头
③ctx.body=ctx.res.body=ctx.response.body(ctx.body属性也就是发送给用户的内容)
④‘/’表示首页
最后一定不要忘了连接端口！

app.listen(3002);                    //这里选了3002端口

整段代码是这个样子的：

var koa = require('koa');
var router = require('koa-router')();
var app=new koa();

router.get('/',async(ctx)=>{
    ctx.body="首页";
})
router.get('/news',async(ctx)=>{
    ctx.body="新闻页面";
})

app.use(router.routes());
app.listen(3002);

测试一下，在网址里输入localhost：3002看一下效果

再加个news看看效果

这样一个简单的路由使用就完成了~

koa动态路由

请求方式——http://域名/模块名/参数（下面的例子中设置了两个参数）

router.get('/newscontent',async(ctx)=>{
   console.log("这是新闻2");
})
router.get('/newscontent/==:aid/:cid==',async(ctx)=>{
    console.log(ctx.params);
    ctx.body="新闻详情";
})                               //注意一下这里两个参数的设置方式

瞅一眼效果

后台是这个样子的

中间件

什么是中间件

配合路由匹配完成所做的一系列操作就叫中间件

中间件的功能

执行任何代码
修改请求和响应对象
终结请求-相应循环
调用堆栈里的下一个中间件

应用级中间件

app.use是express调用中间件的方法，所谓中间件就是处理HTTP请求的参数，用来完成各种特定的任务比如检查用户是否登录，分析数据，以及其他的需要最终将数据发送给用户之前完成的任务。app.use()里面使用的参数主要是函数，这个使用并不是函数调用而是使能的意思，当用户在浏览器发出请求的时候这部分函数才会启用，进行过滤处理

/*匹配路由前打印日期*/
app.use(async(ctx,==next==)=>{
    ctx.body='中间件';
    console.log(new Date());
    await next();/*当前路由完成以后继续向下匹配，这个中间件可以匹配任何路由，但如果不写next这个路由被匹配了就不会向下匹配*/
})

注：这里的参数next是koa框架调用中间件的方式，直接执行app.use之后再执行下一个app.use，下一个app.use也就是next参数，它是一个函数

路由中间件

路由中间件我们在前面就已经零零星星的见过它了，就是下面这些

router.get('/',async(ctx)=>{
    ctx.body="首页";
})

router.get('/news',async(ctx)=>{
    ctx.body="新闻列表页面";
})

router.get('/newscontent/:aid/:cid',async(ctx)=>{
    console.log(ctx.params);
    ctx.body="新闻详情";
})

错误机制处理中间件

在程序执行过程中，会不可避免的出现一些无法预料的失误，错误中间件就是一个集中处理错误的地方

app.use(async(ctx,next)=>{
    next();
    if(ctx.status==404){
        ctx.status=404;
        ctx.body="这是一个404界面";
    }else{
        console.log(ctx.url);
    }
})

这串代码中显示的便是当访问的数据不存在时，在浏览器上显示这是一个404界面，作为一种对错误的处理

此外还有一个第三方中间件，虽然不会用，但有必要在中间件里留下它的姓名

koa中间件的执行顺序——洋葱模型

先来个图，这个执行顺序的样子就很像横着切开的洋葱，一层一层的

中间件函数队列，会在最后一个中间件或一个没有调用next的中间件那里停止
koa官方文档上把外层的中间件称为"上游"，内层的中间件为"下游"
一般的中间件都会执行两次，调用next之前为第一次，调用next时把控制传递给下游的下一个中间件。当下游不再有中间件或者没有执行next函数时，就将依次恢复上游中间件的行为，让上游中间件执行next之后的代码–洋葱模型

举个例子：

var Koa=require('koa');
var router = require('koa-router')();  
var app=new Koa();

//Koa中间件
app.use(async (ctx,next)=>{
    console.log('1、这是第一个中间件01');
    await next();

    console.log('5、匹配路由完成以后又会返回来执行中间件');
})

app.use(async (ctx,next)=>{
    console.log('2、这是第二个中间件02');
    await next();

    console.log('4、匹配路由完成以后又会返回来执行中间件');
})

router.get('/',async (ctx)=>{

    ctx.body="首页";

})
router.get('/news',async (ctx)=>{

    console.log('3、匹配到了news这个路由');
    ctx.body='这是一个新闻';
})


app.use(router.routes());   /*启动路由*/
app.use(router.allowedMethods());
app.listen(3002);

去后台看一下数据，界面如下

最后转一篇超详细的博客，举了很多个实例，可以更深入的理解koa中间件执行顺序
koa洋葱模型的实例

以上如有写的不正确的地方，还请大家指出，希望可以帮到大家

码农公寓