当前位置:首页 > wifi设置知识 > 正文内容

路由的别名和重定向

秋天2023年02月12日 04:40:13wifi设置知识465

当朋友们看到这个文章时想必是想要了解路由的别名和重定向相关的知识,这里同时多从个角度为大家介绍路由器 域名重定向相应的内容。

本文内容目录一览:

Vue路由重定向、别名与导航守卫

在实际的场景中,当用户访问的是一个页面,但可能出现了一些错误,需要给他呈现另一个页面。或者,当用户的注册状态已经过期,需要跳转到登录页,让用户登录后使用。这些场景下就需要用到路由重定向。别名可以理解为重定向的一种,只不过他的 url 是不改变的,也就是说,表面上的 url 不变,但实际上去的是其他页面。导航守卫可以结合登录来说,例如现在有一个后台管理系统,不登录、非管理人员不予呈现页面。在他访问站点时,先进行登录状态的判断,如果没有登录,则重定向到登录页,其他的页面坚决不可以呈现。这就是导航守卫。

重定向的实现很简单,只需要在路由表中使用 redirect 属性就好:

redirect 后面可以跟路径,也可以跟路由名,甚至可以跟一个函数,函数返回一个路径。但一般直接使用路径,毕竟功能一样的情况下,肯定选择写得最少的那个。

官网描述:/a 的别名是 /b,意味着,当用户访问 /b 时,URL 会保持为 /b,但是路由匹配则为 /a,就像用户访问 /a 一样。

尽管表面访问的是 /a ,但实际上呈现的页面是 /b ,不过在路径显示上依然显示 /a 。别名使用属性 alias 实现。

Vue导航守卫这一章节的文档一开头就给我们说:参数的改变并不会触发导航守卫,要想监听路由的变化并做出相应的操作,就必须使用 watch 方法或者 beforeRouteUpdate() 。

不过这并不是今天的主题。回到导航守卫,我们前面讲过一点导航守卫的作用:导航守卫在于保护页面,没有权限的用户或者被限制部分权限的用户在访问网站或者某些页面时是不被允许的。一般情况下,大家面临最多的情况是用户未登录或登录过期时需要调用全局导航守卫,直接跳转到登录页面,引导用户进行登录:

可能还是有人不太懂,对此体会不深,觉得比较飘渺,貌似自己没遇到过。那可以想象以下场景,你在某个人那里得到一个网站的链接,但是这个链接的路径不是网站的首页,而是那个人登录后访问了页面复制给你的链接,这时你打开这个链接,网站检测到你没有登录,便会跳转到登录页。可以拿一个视频网站来试试。

既然有全局导航守卫,就会有相应的局部导航守卫。所谓局部,也就是指组件内的导航守卫了。这里的守卫主要是用于监测路由导航到该组件的进程,并在进程中做一些操作,类似于生命周期钩子函数:

可以看到 beforeRouteUpdate 这个方法,我们在本节开头讲过。三个守卫分别对应导航前、导航中、导航后。 beforeRouteUpdate 的用法正如前面演示的那样,用于组件内监测路由变化,并做出相应操作。 beforeRouteLeave 则可以用于禁止用户在还未保存修改前突然离开。

其他的导航守卫这里便不在做演示了,在平时开发中这几个守卫比较常用,有需要有兴趣的同学可以去官网或视频网站找找相关教学。

什么是路由重定向?ICMP为重定向产生的报文格式是什么?

路由重定向:

表示将你原来在转发列表中发向一台路由的路径改成另外一条路径,也就相当于让你的数据走另外一条路到服务器。

好处和坏处:当一个路由出现问题的时候,会自动重定向到另外一个路由上去,保证你的数据畅通。坏处:可能会出现一定的延时,造成网速变慢。但是一切都是由路由的路由表自动控制的

ICMP为重定向产生的报文格式:

各种ICMP报文的前32bits都是三个长度固定的字段:type类型字段(8位)、code代码字段(8位)、checksum校验和字段(16位)8bits类型和8bits代码字段:一起决定了ICMP报文的类型。

Vue路由 重定向和 别名的区别

重定向

重定向也是通过 routes 配置来完成,下面例子是从 /a 重定向到 /b:

const router = new VueRouter({

routes: [

{ path: '/a', redirect: '/b' }

]

})

重定向的目标也可以是一个命名的路由:

const router = new VueRouter({

routes: [

{ path: '/a', redirect: '/b' }

]

})

甚至是一个方法,动态返回重定向目标:

const router = new VueRouter({

routes: [

{ path: '/a', redirect: to = {

// 方法接收 目标路由 作为参数

// return 重定向的 字符串路径/路径对象

}}

]

})

注意导航守卫并没有应用在跳转路由上,而仅仅应用在其目标上。在下面这个例子中,为 /a 路由添加一个 beforeEach 或 beforeLeave 守卫并不会有任何效果。

其它高级用法,请参考例子。

别名

『重定向』的意思是,当用户访问 /a时,URL 将会被替换成 /b,然后匹配路由为 /b,那么『别名』又是什么呢?

/a 的别名是 /b,意味着,当用户访问 /b 时,URL 会保持为 /b,但是路由匹配则为 /a,就像用户访问 /a 一样。

上面对应的路由配置为:

const router = new VueRouter({

routes: [

{ path: '/a', component: A, alias: '/b' }

]

})

『别名』的功能让你可以自由地将 UI 结构映射到任意的 URL,而不是受限于配置的嵌套路由结构。

路由的别名和重定向的介绍就聊到这里吧,感谢你花时间阅读本站内容,更多关于路由器 域名重定向、路由的别名和重定向的信息别忘了在本站进行查找喔。

扫描二维码推送至手机访问。

版权声明:本文由路由设置网发布,如需转载请注明出处。

本文链接:https://www.shoulian.org/luyou/post/7016.html

分享给朋友:

“路由的别名和重定向” 的相关文章

路由器怎么才能连接猫

路由器怎么才能连接猫

当朋友们看到这个文章时想必是想要了解路由器怎么才能连接猫相关的知识,这里同时多从个角度为大家介绍路由器怎么才能连接猫上网相应的内容。 本文内容目录一览: 1、路由器怎么连接猫安装方法 2、路由器怎么连接光猫 3、路由器怎么直接连接猫 4、路由器跟猫怎么连接 路由器怎么连接猫安装方法 路...

手机怎么登录路由器入口

手机怎么登录路由器入口

今天给各位分享手机怎么登录路由器入口的知识,其中也会对手机怎么登录路由器入口网址进行解释,如果能碰巧解决你现在面临的问题,别忘了关注本站 本文内容目录一览: 1、手机路由器设置登录入口 2、手机怎么登录路由器设置页面 3、192.168.0.1手机怎么登陆路由器 4、手机怎么登陆192....

路由器ac名字怎么填

路由器ac名字怎么填

本篇文章给大家谈谈路由器ac名字怎么填,以及你居然当着老师的面偷看真是什么歇后语对应的知识点,希望对各位有所帮助,不要忘了收藏本站喔。 本文内容目录一览: 1、在路由器里设置的时候这个服务名和AC名要怎么填上去?是PPPoE用户的 2、AC怎么填啊 3、设置无线带猫的路由器acname是什么...

路由器中继固件怎么刷

路由器中继固件怎么刷

今天和朋友们分享路由器中继固件怎么刷相关的知识,相信大家通过本文介绍也能对路由器为什么刷固件有自已的收获和理解。自己轻松搞问题。本文内容目录一览: 1、ourlink无线中继路由器怎么升级固件? 2、Dlink早期路由器刷中继固件 3、路由器中继怎么弄 4、我买了一个磊科ni360路由器...

怎么组合多个路由器组网

怎么组合多个路由器组网

今天给各位分享怎么组合多个路由器组网的知识,其中也会对多个无线路由组网进行解释,如果能碰巧解决你现在面临的问题,别忘了关注本站 本文内容目录一览: 1、多个路由器如何组网 2、两台路由器怎么无线组网? 3、怎么设置多路由器组网? 多个路由器如何组网 1方式一:通过无线智联。将第一台华--为...

在学校怎么装路由器

在学校怎么装路由器

本篇文章给大家谈谈在学校怎么装路由器,以及学校自己装路由器怎么安装对应的知识点,希望对各位有所帮助,不要忘了收藏本站喔。 本文内容目录一览: 1、校园网宽带怎么连接路由器 2、校园网怎么设置路由器 3、校园内如何设置路由器 4、学生宿舍怎么安装路由器? 5、学校宿舍里面怎么安装无线路...