vue实现登录后页面跳转到之前页面
在开发中我们经常遇到这样的需求，需要用户直接点击一个链接进入到一个页面，用户点击后链接后会触发401拦截返回登录界面，登录后又跳转到链接的页面而不是首页，这种问题该如何去做呢？
先说一下我们需要用到的几个API：
1.router.currentRoute:当前的路由信息对象，我们可以通过router.currentRoute.fullPath获得解析后的 URL，包含查询参数和 hash 的完整路径，如果要访问的页面的路由有命名（name）的话，可以通过router.currentRoute.name获得当前路由的名称。
2.router.replace：作用和router.push相同，不过它不会向history添加新纪录，而是替换当前的history记录。
由于大家的代码写的都不一样，我就不放我具体的实现代码，简单介绍一下思路：
1.用户点开链接后，跳转到的目标的路由页面，然后触发401拦截器，返回登录页面：
//401拦截
if（status == "401"）{
router.push("/login")
}
2.我们可以在401拦截的时候将目标链接保存在url中：
if (status == 401) {
//判断当前的路由是否是目标路由
if(router.currentRoute.name == "target"){
//跳转回login路由，并把目标路由的url路径保存在login的query中
router.replace({
name:"login",
query: {redirect: router.currentRoute.fullPath}
})
}else{
/* 普通401拦截直接返回到登录页面 */
router.push('/login');
}
}
3.点击登录后使用url上保存的query直接跳转回目标页面
router.push({path:decodeURIComponent(url)});
以上就是我们分享的功能实现代码，感谢你对小牛知识库的支持。
-
本文向大家介绍JS实现页面超时后自动跳转到登陆页面，包括了JS实现页面超时后自动跳转到登陆页面的使用技巧和注意事项，需要的朋友参考一下 JS代码： 代码很简单，却很实用，希望小伙伴们能够喜欢，直接拿去用吧。
-
本文向大家介绍vue登录页面cookie的使用及页面跳转代码，包括了vue登录页面cookie的使用及页面跳转代码的使用技巧和注意事项，需要的朋友参考一下 1、大概流程 a、登录：前端使用validate对输入信息进行验证 验证成功则成功跳转到用户信息页并存储cookie值 b、首页跳转用户信息页：判断cookie值cookie存在并不为空则跳转用户信息页,若为空则跳转登录页 c、退出页：点
-
本文向大家介绍Vue登录拦截 登录后继续跳转指定页面的操作，包括了Vue登录拦截 登录后继续跳转指定页面的操作的使用技巧和注意事项，需要的朋友参考一下 在开发中我们经常遇到这样的需求，需要用户登录后才可以访问该页面，如果用户没有登录点击该页面时则自动跳转到登录页面，登录后又跳转到链接的页面而不是首页，这种问题该如何去做呢？ 1、在路由器router下的 index.js 的配置中，给需要拦截登录的
-
本文向大家介绍vue利用全局导航守卫作登录后跳转到未登录前指定页面的实例代码，包括了vue利用全局导航守卫作登录后跳转到未登录前指定页面的实例代码的使用技巧和注意事项，需要的朋友参考一下 有这样一个场景：如果你在登录之前输入了http://localhost:8080/oauth2-mgm-app/#/userManage，想进入userManage页面，但是由于没有登录，系统是不会让你进入这个页
-
本文向大家介绍Session过期后自动跳转到登录页面的实例代码，包括了Session过期后自动跳转到登录页面的实例代码的使用技巧和注意事项，需要的朋友参考一下 最近做了一个项目其中有需求，要实现自动登录功能，通过查阅相关资料，打算用session监听来做，下面给大家列出了配置监听器的方法： 1.在项目的web.xml文件中添加如下代码： 2.编写java类。 配置完成后等session失效后成功进
-
本文向大家介绍重写 ajax 实现 session 超时跳转到登录页面实例代码，包括了重写 ajax 实现 session 超时跳转到登录页面实例代码的使用技巧和注意事项，需要的朋友参考一下 问题：使用window.location.href来跳转页面的时候，后端只需实现一个过滤器就可以在session超时的情况下重定向到登陆页面。但是使用ajax呢？使用ajax来执行会发生302错误，并且页面不