手机版

详细说明koa路由器路由参数和前端路由的组合

时间:2021-08-23 来源:互联网 编辑:宝哥软件园 浏览:

当koa-router定制路由时,它支持以冒号形式在url中指定参数,这些参数将被装载到上下文中,然后可以通过context.params.paramName方便地获得

检查以下示例:

var Koa=require(' Koa ');var Router=require(' KOA-Router ');var app=new Koa();var Router=new Router();router.get('/user/:id ',async函数(ctx,next){ const UserID=CTX . params . id;ctx.body=`用户id为: $ { UserID } `;});app.use(router.routes())。使用(router . allowedmethods());app . listen(3000);console.log('服务器启动于http : localhost :3000 ');启动服务后,您可以看到从url获取的id参数显示在页面上。

路由参数的获取和显示

现在考虑另一种情况,即路由中支持前端路由的情况。

也就是说,当前url从/user/:id扩展到/user/:id/foo/bar,其中/foo/bar可以是任何路由,作为前端处理的路由部分。

为了实现这样的前端路由部分,需要通过正则化的方式进行服务器端路由的配置,

- router.get('/user/:id ',async函数(ctx,next){ router . get(['/user/: id ',/\/user\/([\w|\d] )\/。*/],异步函数(ctx,next){ const UserID=CTX . params . id;ctx.body=`用户id为: $ { UserID } `;});在这里,路由中的url从单个字符串变成了数组形式,第一个是原来的路由,这样/user/1形式的普通页面就可以命中路由了。同时,添加/\/user\/([\w|\d] )\/。*/,因为路由中通过冒号的参数配置在正则性的情况下不再被支持,所以id跟在/user/这里也需要被正则性代替。

但是,常规匹配下的路由无法通过context.params访问url上的参数幸运的是,参数可以以常规中定义的Capturing Groups的形式定义,也就是说,用方括号([\w|\d])包装的部分称为匹配组,匹配组将自动挂载到context.params上,只是它没有像冒号定义的参数那样的名称。这种形式的参数按照匹配顺序赋给数组中的context.params,因此访问第一个匹配组形成的参数可以通过context.params[0]获得。

因此,上面的代码稍加修改后,可以正确处理由命名参数(通过冒号匹配)或常规参数形成的查询参数。

- router.get('/user/:id ',async函数(ctx,next){ router . get(['/user/: id ',/\/user\/([\w|\d] )\/。*/],异步函数(ctx,next){-const UserID=CTX . params . id;const UserID=CTX . params . id | | CTX . params[0];ctx.body=`用户id为: $ { UserID } `;});最终完整的代码如下所示:

var Koa=require(' Koa ');var Router=require(' KOA-Router ');var app=new Koa();var Router=new Router();router.get(['/user/:id ',/\/user\/([\w|\d] )\/。*/],异步函数(ctx,next){ const UserID=CTX . params . id | | CTX . params[0];ctx.body=`用户id为: $ { UserID } `;});app.use(router.routes())。使用(router . allowedmethods());app . listen(3000);console.log('服务器启动于http : localhost :3000 ');此时,访问以下连接进行测试,

http://localhost 33603000/user/1 http://localhost 33603000/user/2/foo http://localhost :3000/user/3/foo/bar可以正确命中页面并成功获取路由中的参数。

常规路由和路由参数的获取

摘要

以上就是本文的全部内容。希望本文的内容对大家的学习或工作有一定的参考价值。谢谢你的支持。

版权声明:详细说明koa路由器路由参数和前端路由的组合是由宝哥软件园云端程序自动收集整理而来。如果本文侵犯了你的权益,请联系本站底部QQ或者邮箱删除。