扫码关注官方订阅号
84669人学习
65727人学习
82984人学习
467778人学习
498837人学习
471966人学习
256484人学习
152542人学习
224170人学习
139536人学习
81804人学习
85022人学习
11944人学习
20001人学习
60816人学习
5487人学习
15007人学习
2150人学习
6980人学习
194925人学习
359900人学习
1142人学习
19058人学习
3206人学习
180550人学习
48569人学习
17603人学习
40936人学习
1049人学习
750人学习
32909人学习
项目是前后分离,后端只给前端接口,每一个接口带token,现在有一些需要登录才能进去的页面,前端如何拦截。比如:由A页面 通过A标签跳转到 B页面(B页面需要登录才能进去)。我现在做法是进到B页面,发送ajax请求,后台返回状态才做跳转到登录页面,现在问题是我已经进到B页面才做判断很不合理。
前端如何拦截
A页面
B页面
发送ajax请求
可以考虑点击a标签的时候先发ajax请求再决定往哪跳转?
可以自己封装一个ajax请求,单独判断登录状态,未登录跳转登录,登录直接返回数据
写一个公共的js 在里面写页面加载函数 你需要登录授权才能访问的页面就引用 然后在里面写逻辑判断
前端不做拦截,服务器端做拦截。前端拦截的话,只能在B页面做,你考虑一下拼写url进入呢?B页面访问接口尝试拿userinfo,拿到就是登陆了,没拿到就没登录。
token一般都有过期时间,用localstorage保存token的时候带上一个过期时间,页面跳转的时候先判断token是否过期,过期了就跳登录页,没有就继续。如果是单页的应用这个就很好解决,如果不是单页的话,就写到一个公共js里。
肯定会由用户某个交互动作 导致 跳转到第二个页面的, 再跳转之前 进行登录验证, 没有登录就让其登录(或者注册), 登录(注册)肯定要 封装起来的, 封装的时候 预留 登录后的 成功回调和 注册成功 后的回调, 在回调函数中再做跳转 到B页面
这种两种方法解决:1、服务端做验证 既然是要登录才能进去的页面 必然会涉及到用户权限 在B页面发的ajax请求中有token 后端做token过期的验证 判断是否有权限 报错统一返回 前端写一个公共方法验证没有权限的错误信息 (这种方式要做到响应的接口上 比较保险)2、前端在每个页面写个看门狗js,判断存储用户信息中的过期时间 在做跳转。
我看楼主的需求是想在点击的时候做判断是否跳转 可以把a标签换成点击函数 在函数中判断 使用window.location.href = url 的方式跳转页面
lz前端框架用的什么? 我知道vue_router中有钩子函数可以实现, 在router.beforeEach的时候判断是否登录,如果没有登录就去登录,如果登录就直接next()
微信扫码关注PHP中文网服务号
QQ扫码加入技术交流群
扫描下载App
Copyright 2014-2024 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
精品班
技术支持
技术咨询
学习群
会员优惠
返回顶部
可以考虑点击a标签的时候先发ajax请求再决定往哪跳转?
可以自己封装一个ajax请求,单独判断登录状态,未登录跳转登录,登录直接返回数据
写一个公共的js 在里面写页面加载函数 你需要登录授权才能访问的页面就引用 然后在里面写逻辑判断
前端不做拦截,服务器端做拦截。前端拦截的话,只能在B页面做,你考虑一下拼写url进入呢?B页面访问接口尝试拿userinfo,拿到就是登陆了,没拿到就没登录。
token一般都有过期时间,用localstorage保存token的时候带上一个过期时间,页面跳转的时候先判断token
是否过期,过期了就跳登录页,没有就继续。
如果是单页的应用这个就很好解决,如果不是单页的话,就写到一个公共js里。
肯定会由用户某个交互动作 导致 跳转到第二个页面的, 再跳转之前 进行登录验证, 没有登录就让其登录(或者注册), 登录(注册)肯定要 封装起来的, 封装的时候 预留 登录后的 成功回调和 注册成功 后的回调, 在回调函数中再做跳转 到B页面
这种两种方法解决:
1、服务端做验证 既然是要登录才能进去的页面 必然会涉及到用户权限 在B页面发的ajax请求中有token 后端做token过期的验证 判断是否有权限 报错统一返回 前端写一个公共方法验证没有权限的错误信息 (这种方式要做到响应的接口上 比较保险)
2、前端在每个页面写个看门狗js,判断存储用户信息中的过期时间 在做跳转。
我看楼主的需求是想在点击的时候做判断是否跳转 可以把a标签换成点击函数 在函数中判断 使用window.location.href = url 的方式跳转页面
lz前端框架用的什么?
我知道vue_router中有钩子函数可以实现, 在router.beforeEach的时候判断是否登录,如果没有登录就去登录,如果登录就直接next()