source

vue/ssr에서 vuex-persisted state를 구현하는 방법

factcode 2022. 8. 14. 11:54
반응형

vue/ssr에서 vuex-persisted state를 구현하는 방법

vue sr 앱에서 상태를 유지해야 하는데 구현 방법을 이해할 수 없습니다.

저장공간으로 쿠키를 사용하고 싶다.

readme에 기재되어 있는 대로 플러그인을 설치해도 이상할 정도로 아무 일도 일어나지 않습니다.js-cookies가 "window"를 호출하기 때문에 오류가 발생합니다.

문제는 vue/ssr에서 vuex-persisted state를 구현하는 방법입니다.

req.cookies에서는 쿠키에 액세스할 수 있지만 브라우저에서 쿠키를 설정할 수 없습니다.서버측에서는 스토어가 가득 차 js-cookies 콜이 이루어지기 때문에 이것은 예상된 것입니다.

소스 코드로 수정될 때까지 저는 다음과 같이 처리했습니다.

보관소.js

import CreatePersistedState from 'vuex-persistedstate'

let PersistedState

if (process.browser) {
  PersistedState = CreatePersistedState(yourOptions)
}

export default PersistedState

store.displaces를 설정합니다.

import CreatePersistedState from 'src/util/plugins/storage'
...

const plugins = []

if (process.browser) {
  plugins.push(CreatePersistedState)
}

export default function createStore() {
  return new Vuex.Store({
    state,
    modules,
    actions,
    mutations,
    getters,
    strict: false,
    plugins: plugins
  })
}

언급URL : https://stackoverflow.com/questions/51200694/how-to-implement-vuex-persistedstate-in-vue-ssr

반응형