2016-10-05 2 views
0

vue.js 응용 프로그램에 로그인 시스템이 있습니다. 내 main.js은 다음과 같습니다Laravel & Vue.js 인증

checkAuth() { 
    var token || localStorage.getItem('jwt-token'); 

    if (!token) { 
     return false; 
    } 

    Vue.http.get('/api/me') 
     .then(({data}) => { 
     this.user.id = data.id; 
     this.user.name = data.name; 
     this.user.email = data.email; 
     this.user.role = data.role; 
     this.user.authenticated = true; 
     }, ({data}) => { 
      router.go('/'); 
     }); 
    } 

그래서 내 문제는 내 router.beforeEach에 있다는 것입니다 ->auth.user.authenticated 내가 있는지 확인 :

import Vue from 'vue'; 
import NProgress from 'nprogress'; 
import Resource from 'vue-resource'; 
import Router from 'vue-router'; 
import App from './App.vue'; 
import Login from './components/Authentication/Login.vue'; 
import auth from './Services/Authentication/Auth'; 


Vue.use(Router); 
Vue.use(Resource); 

auth.checkAuth(); 

export var router = new Router({ 
    history: true 
}); 

router.map({ 
    '/': { 
     name: 'Login', 
     component: Login, 
     guest: true 
    } 
}); 

router.beforeEach((transition) => {  
    if (transition.to.auth && !auth.user.authenticated) { 
     transition.redirect('/login'); 
    } else if (transition.to.guest && auth.user.authenticated) { 
     transition.redirect('/'); 
    } else { 
     transition.next(); 
    } 
}); 

Vue.http.interceptors.push((request, next) => {  
    NProgress.start(); 
    const token = auth.getToken(); 
    request.headers['Authorization'] = 'Bearer ' + token; 
    request.headers['X-CSRF-TOKEN'] = document.querySelector('meta[name="token"]').content; 

    request.respondWith(request.body); 

    next((response) => { 
     NProgress.done(); 

     if (response.status == 404) { 
      router.go('/'); 
     } else if (response.status == 401 && response.data.refreshed_token) { 
      // If you received 401 "Unauthorized" response 
      // with a refreshed_token in the payload, 
      // this means you've got to refresh your token 
      auth.setToken(response.data.refreshed_token); 
     } 

     return response; 
    }); 
}); 

그래서 모든 요청에 ​​내가 auth.checkAuth(); 그 기능이 (Auth.js)과 같은 사용자를 확인 사용자가 인증됩니다. 그러나 auth.checkAuth();의 약속이 반환되지 않으므로 auth.user.authenticated은 항상 거짓입니다!

이 문제를 어떻게 해결할 수 있습니까?

매우 도움이 되겠습니까? 향후 사용자의 경우

+0

사람을 가지고! 부디! – Jamie

답변

1

같은 문제를

Vue.http.interceptors.push((request, next) => { 
    request.headers.set('X-CSRF-TOKEN', Laravel.csrfToken); 
    next((response) => { 
     if(response.status == 401) {//or add any error code you want here 
      //Do another request for some endpoint here to get a fresh token and override your token variable 
     } 
    }); 
});