GET /auth
бек будет отдавать данные, если есть сессия или возвращать ошибку 401 если пользователь неавторизован. В сторе vue создайте модуль user:export default {
state: {
user: null,
},
getters: {
isAuthenticated: ({ user }) => Boolean(user),
},
actions: {
getUser({ commit, dispatch }) {
return this.$axios.get('/auth')
.then(user => commit('setUser', user))
.catch(() => dispatch('logout'));
},
login({ dispatch }, { email, password }) {
return this.$axios.post('/login', {
email, password,
})
.then(() => dispatch('getUser'));
},
logout({ commit }) {
commit('unsetUser');
},
},
mutations: {
setUser(state, user) {
state.user = user;
},
unsetUser(state) {
state.user = null;
},
},
};
getUser
, если есть сессия показываем что-то в противном случае форму авторизации, еще в корне приложения можно подписаться на ошибки стора this.$store.subscribeAction
и ловить 401, чтобы сделать logout <a id="authPopupLink" rel="nofollow" itle="Мой кабинет" class="personal-link dark-color animate-load" data-param-type="auth" data-event="jqm" data-param-backurl="/auth/index.php" data-name="auth" href="/personal/">
<i class="svg inline svg-inline-cabinet" aria-hidden="true" title="Мой кабинет">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="17" viewBox="0 0 16 17">
<defs>
<svg:style> .loccls-1 { fill: #222; fill-rule: evenodd; } </svg:style>
</defs>
<path class="loccls-1" d="M14,17H2a2,2,0,0,1-2-2V8A2,2,0,0,1,2,6H3V4A4,4,0,0,1,7,0H9a4,4,0,0,1,4,4V6h1a2,2,0,0,1,2,2v7A2,2,0,0,1,14,17ZM11,4A2,2,0,0,0,9,2H7A2,2,0,0,0,5,4V6h6V4Zm3,4H2v7H14V8ZM8,9a1,1,0,0,1,1,1v2a1,1,0,0,1-2,0V10A1,1,0,0,1,8,9Z"></path>
</svg>
</i>
<span class="wrap">
<span class="name">Войти</span>
</span>
</a>