奔三路 - 你30岁前的学习路!

奔三路学习网

当前位置: 主页 > 大前端知识 > 大神说 >

原生JS实现Node框架Express的动态路由原理

时间:2018-03-08 22:32来源:原创 作者:admin
动态路由及url地址不是固定的,通常由编号自增长id组成,其长度没有规律也没有限制。 这样的动态路由我们在node.js语言的express框架使用的时候,有使用过。 况且其支持多个变量和正
动态路由及url地址不是固定的,通常由编号自增长id组成,其长度没有规律也没有限制。
这样的动态路由我们在node.js语言的express框架使用的时候,有使用过。

况且其支持多个变量和正则表达式,这次实践的是可以支持多个动态变量的路由

一个的变量路由:
app.use('/topic/:id',function (req,res) {
   //显示主题对应的列表 
 
})
多个变量路由:

app.use('/commic/:id/:commic_id',function (req,res) {
 
})

底层实现原理思路:

第一步:


对use方法传进来的第一个参数进行分析,如果有/:,那么就是动态路由

if (item.url.indexOf('/:') > 0) {
 isDtRouter = this.setDtRouter(req,item.url)
}

第二步:

获取第一个/:位置后,再通过/:分割余下的字符串,因此就可以支持多个变量了
let index = useUrl.indexOf('/:')   //第一个/:位置
let useUrlName = useUrl.substring(0,index)  //截取前部分,以获得这个url的名称 即:/commic

let useUrlLastStr =  useUrl.substring(index+2,useUrl.length)   //截取后部分,以获得这个url的动态参数名称,即:id/:commic_id
 
let useUrlParamsA = useUrlLastStr.split('/:')   //分割后部分,返回一个数组,即:['id','commic_id']

第三步:

获取实际传过来的reqUrl,并做和第二步截取、分割操作

let reqUrlName = reqUrl.substring(0,index)   //截取前部分,以获得这个url的名称 即:/commic
let reqVal = reqUrl.substring(index+1,reqUrl.length)    //截取后部分,以获得这个url的动态参数名称,即:12/1

let reqUrlParamsA = reqVal.split('/')  //分割后部分,返回一个数组,即:[12,1]
 
第四步:

给http的请求req对象添加参数,这样我们就可以通过req.params.id获取值
req.params = []
useUrlParamsA.forEach((item,ind)=>{
    req.params[item] = reqUrlParamsA[ind]
})
立正,解散,至此动态路由就实现好了。烧年们顺着阿哥的思路撸一撸吧! (责任编辑:admin)
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片
发布者资料
小邱 查看详细资料 发送留言 加为好友 用户等级:注册会员 注册时间:2017-11-26 17:11 最后登录:2018-06-11 16:06

关注奔三路