Блог

В чем проблема в маршруте охраны условие if(!store.getters.loggedIn) всегда возвращает false. Если нет жетона, я могу пойти очень разными маршрутами. может ли кто-нибудь подсказать мне решение, пожалуйста . я ожидаю, что захочу сделать маршрут охраны, когда пользователь не входит в систему и нет токена от api, он перенаправит на страницу входа, и если пользователь не входит в систему, пользователь может перейти только на страницу входа.

в store.js

 import http from '@/axiosAPI/axios.js';
import router from '@/route/index';

const auth = {
namespaced: true,
state:{
    Users: [],
    Errors: [],
    Success:"",
    Loginerror:"",
    Token: localStorage.getItem('access_token') || null,
},
getters:{
    loggedIn(state){
        return state.Token !== null;
    }
},
mutations:{  
    LOGIN_ERROR(state,erro){
        state.Loginerror = erro;
    },
    AUTH(state,token){
        state.Token = token;
    },
    UNAUTH(state){
        state.Token = null;
    }
},
actions:{
    loginUser({commit}, formData){
        http.post("/login",formData).then((response)=>{
            if(response.data.status === 'success'){
                //set token
                const token = response.data.token;
                localStorage.setItem('access_token',token);
                localStorage.setItem('user',response.data.user);
                commit('AUTH',token); 
                router.push({name:'Dashboard'});
                router.go();
            }else{
                commit("LOGIN_ERROR",response.data.message);
            }
        })
        .catch((error)=>{
            if(error){
                commit('UNAUTH');
                localStorage.removeItem('access_token');
                localStorage.removeItem('user');
                commit("GET_ERRORS",error.response.data.errors);
            }
        });
    },
    logoutUser({commit}){
        http.post("/auth/logout").then((response)=>{
            if(response.data.status === "success"){
                commit('UNAUTH');
                localStorage.removeItem('access_token');
                localStorage.removeItem('user');
                router.push({name:'Login'});
                window.location.reload();
            }else{
                commit("LOGIN_ERROR",response.data.message);
            }
        })
        .catch((error)=>{
            if(error){
                commit("GET_ERRORS",error.response.data.errors);
            }
        });
    },
    deleteUsers({commit},userID){
        http.delete("/auth/delete/" userID).then((response)=>{
            if(response.data.status === 'success'){
                commit("SUCCESS",response);
                router.go(); //to reload page
            }
            else if(response.data.status ==='fail'){
                commit("GET_ERRORS",response.data.message);
            }
        })
        .catch((error)=>{
            console.log(error.response);
        });
    }
},
}
export default auth
 

в route.js

Даже если у меня нет токена, я могу перейти на каждый маршрут, и условие в маршруте охраны всегда возвращает false

  import route from '@/route/index.js';
    import store from '@/store/modules/auth.js';

    route.beforeEach((to, from, next) => {    
    const requiresAuth = to.matched.some(record => record.meta.requiresAuth);
    if(requiresAuth){
        if(!store.getters.loggedIn){ //i think the problem is here 
            next({name: 'Login'}); 
        }else{
            next();
        }
    }else{ 
        next();
    }
    });
 

Один из способов проверить, вошел ли пользователь в систему, — это напрямую проверить, есть ли токен в localStorage.

 route.beforeEach((to, from, next) => {
  const token = localStorage.getItem('access_token')

  //if not logged in, redirect to Login page
  if (!token) next ({ name: 'Login' });

  //else continue
  else next();
});