vuex를 사용하여 페이지를 새로 고친 후에도 로그인 상태를 유지하는 방법

vuex를 사용하여 페이지를 새로 고친 후에도 로그인 상태를 유지하는 방법

로그인하려면 서드파티 API를 호출하여 액세스 토큰을 제공합니다.

이것은 vuex가 포함된 my store.vpair 코드입니다.

/* eslint-disable */
import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

export default new Vuex.Store({
    strict: true,
    state: {
        token: null,
        isUserLoggedIn: false,
        userEmailAddress: null
    },
    mutations: {
        setToken (state, token) {
            state.token = token
            if (token) {
                state.isUserLoggedIn = true
            } else {
                state.isUserLoggedIn = false
                this.$router.push('login')
            }
        },
        setEmailAddress (state, emailAddress) {
            state.userEmailAddress = emailAddress
        }
    },
    actions: {
        setToken ({commit}, token) {
            commit('setToken', token)
        },
        setEmailAddress ({commit}, emailAddress) {
            commit('setEmailAddress', emailAddress)
        }
    }
})

여권을 사용하지 않기 때문에 페이지를 새로 고친 후에도 로그인 상태를 유지하려면 어떻게 해야 합니까?

토큰을 local스토리지에 저장할 수 있습니다. localStorage.setItem("token", token). 앱이 로드되면 토큰이 있는지 확인합니다.localStorage.getItem("token")아마 유효성도 확인할 수 있을 겁니다

편집: 앞서 말한 기술을 사용하여 이를 실현하는 방법에 대한 자세한 튜토리얼이 있습니다.https://medium.com/front-end-hacking/persisting-user-authentication-with-vuex-in-vue-b1514d5d3278

언급URL : https://stackoverflow.com/questions/51892979/how-to-stay-logged-in-even-after-page-refresh-with-vuex