uniapp 全局检查登陆并跳转函数

环境

laravel5.7 jwt-auth uniapp

场景

进入页面 pages/index/index 时检查登陆状态，如未登录跳转到登陆页面 pages/index/login，登陆成功后返回跳转前的页面 pages/index/index。

参考

封装全局登录检查函数并部署

挂载全局登陆检查函数 main.js

import Vue from 'vue'
import App from './App'

import { http } from '@/utils/luch/index.js'
Vue.prototype.$http = http

//backpage : 登录后返回的页面
//backtype : 打开页面的类型[1 : redirectTo 2 : switchTab]
import jwt from '@/utils/auth/jwt.js';
Vue.prototype.checkLogin = async (backpage,backtype) => {
    var TOKEN  = jwt.getAccessToken();
    let status = false;
    if(TOKEN){
        await http.get('/api/auth/check').then(res=>{
            console.log('check auth');
            status = res.data.data.user;
        }).catch(err=>{
            console.log('status 401 not login')
            status = false;
        })
    }else{
        status = false;
        console.log('not token')
    }

    console.log(status,'result status');
    if(status){return status}else{

        uni.showToast({icon:'none',title: '请登陆',duration:1000});
        // 跳转到登陆页面
        setTimeout(function(){
            uni.redirectTo({url:'/pages/index/login?backpage='+backpage+'&backtype='+backtype});
        },1500);

        return false;
    }
}

Vue.config.productionTip = false
App.mpType = 'app'
const app = new Vue({
    ...App
})
app.$mount()

后端 check 方法

Route::get('check','AuthController@check'); // 检测登陆状态
// 能请求到 check() 一定是登陆的，未登陆在权限中间件中返回 401
public function check(){
   return Y::json(['user'=>auth()->user()]);
}

/pages/index/index

<script>
    export default {
        data() {
            return {
                me: {},
            }
        },
        onLoad() {
        // 页面一加载时调用 参数含义：
        // "/pages/index/index": 当前页面地址
        // "1": 跳转方式是 redirect
            let user =  this.checkLogin('/pages/index/index',1);

            if(user){ this.me = user }

            console.log('has login and save userinfo');
        },
    }
</script>

登陆页面 pages/index/login

<script>
    import jwt from '@/utils/auth/jwt.js';
    export default {
        data() {
            return {
                backpage:'',
                backtype:'',
            }
        },
        onLoad(o) {
            this.backpage = o.backpage;
            this.backtype = o.backtype;
            console.log(this.backpage,this.backtype,'backage and backtype');
        },
        methods: {
            login: function(e){
                let value = e.detail.value;
                if( !value.username || !value.password ){
                    uni.showToast({icon:'none',title: '账号密码不能为空',duration:2000});
                    return;
                }
                this.$http.post('/api/auth/login',value).then(res=>{
                    let data = res.data;
                    if(data.code == 0){
                        jwt.setAccessToken(res.data.data.access_token);
                        // 跳回
                        if(this.backtype == '1'){
                            uni.redirectTo({ url: this.backpage });
                        }else{
                            uni.switchTab({ url: this.backpage });
                        }
                    }else{
                        uni.showToast({icon:'none',title: data.msg,duration:2000});
                    }

                }).catch(err=>{
                    // console.log(err,'err');
                    uni.showToast({icon:'none',title: err.data.msg,duration:2000});
                })
            }
        }
    }
</script>

本作品采用《CC 协议》，转载必须注明作者和本文链接