1、首先在根目录下新建一个文件夹(昵称任意)components。在components文件夹下建一个interceptor.js。
2、在interceptor.js中写入,下面代码中的白名单数组whiteList中写入的页面路径是允许未登录也能访问的页面,简单来说就是写在whiteList中的页面路径就是可放行,否者就拦截让用户去登录。
// 页面白名单,不受拦截
const whiteList = [
'/pages/index/index',
'/pages/class/class',
'/pages/release/release',
'/pages/mine/mine'
]
function hasPermission (url) {
let token= uni.getStorageSync('token');//token是登录成功后在本地存储登录标识,存储一个能够判断用户登录的唯一标识就行
token= Boolean(Number(token));//返回布尔值
// 在白名单中或有登录判断条件可以直接跳转
if(whiteList.indexOf(url) !== -1 || token) {
console.log('通过')
return true
}
console.log('失败')
return false
}
uni.addInterceptor('navigateTo', {
// 页面跳转前进行拦截, invoke根据返回值进行判断是否继续执行跳转
invoke (e) {
if(!hasPermission(e.url)){
uni.reLaunch({
url: '/pages/login/login'
})
return false
}
return true
},
success (e) {
}
})
uni.addInterceptor('switchTab', {
// tabbar页面跳转前进行拦截
invoke (e) {
if(!hasPermission(e.url)){
uni.reLaunch({
url: '/pages/login/login'
})
console.log('不在白名单内')
return false
}
console.log('在白名单内')
return true
},
success (e) {
}
})
3、登录页面,登录成功时在本地存一个用户登录唯一标识符:“token”,用于拦截器判断用户是否登录。
4、在main.js中引用。 import './components/interceptor.js;//引入拦截