redux-persist 사용시 api 호출 실패

Question

// index.js import createSagaMiddleware from 'redux-saga'; import { applyMiddleware, createStore } from 'redux'; import persistedReducer, { rootSaga } from './modules'; import { composeWithDevTools } from 'redux-devtools-extension'; import { persistStore } from 'redux-persist'; import { PersistGate } from 'redux-persist/integration/react'; const sagaMiddleware = createSagaMiddleware(); export const store = createStore(persistedReducer, composeWithDevTools(applyMiddleware(sagaMiddleware))); export const persistor = persistStore(store); sagaMiddleware.run(rootSaga); ReactDOM.render( } persistor={persistor}> , document.getElementById('root'), ); // modules/index.js import { persistReducer } from 'redux-persist'; import storage from 'redux-persist/lib/storage'; const rootPersistConfig = { key: 'root', storage, whitelist: ['authReducer'], }; const rootReducer = combineReducers({ loadingReducer, authReducer, profileReducer, plannerReducer, spotReducer, reviewReducer, }); export function* rootSaga() { yield all([authSaga(), profileSaga(), plannerSaga(), reviewSaga(), spotSaga()]); } const persistedReducer = persistReducer(rootPersistConfig, rootReducer); export default persistedReducer;redux-persist를 적용하려고 하는데요. authReducer의 state는 새로고침해도 local storage에 잘 남아있습니다.하지만 새로고침한 후에 api 호출을 하면 500 에러가 뜨네요. purge 후 로그인을 다시 해야 api가 성공을 합니다.왜 그럴까요??(1차 수정)처음 올리는 질문이라 오류에 대한 정보가 부족했습니다. 죄송합니다.로그인을 위한 토큰은 local storage에 잘 남아있습니다.api 호출시 전달되는 값들도 잘 들어가 있습니다.(2차 수정)application의 localstorage에는 새로고침해도 토큰이 남아있는데, network에서 실패한 api 요청을 보면 토큰이 없네요..그래도 원인을 찾아가고있어서 다행입니다.

Hee Sung Son · Accepted Answer

말씀하시는것만 봐서는 persist는 잘 작동하는데 api 호출만 실패하는 상황이라는 전제하에 말씀드리겠습니다.해당사항은 단서가 부족하긴하지만 확인해봐야 하는 사항이 있습니다.로그인 정보는 저장이 되고 있는가(예시: 쿠키 등)?새로고침 후 api 호출을 위한 정보를 다 가지고 있는가(auth state 아닌 다른 정보)?이점 확인해 보시고 다시 실행해보시는게 어떨까요? 부족하다면 해당 오류에대한 자세한 정보가 더 필요할 것으로 보입니다.

redux-persist 사용시 api 호출 실패

1개의 답변

Q&A 목록