redux-persist: persist/REHYDRATE payload and err is undefined

I use redux-persist 5.7.2 with react-starter-kit. I tried 5.6.12, it doesn’t run persist/REHYDRATE. configureStore.js const authPersistConfig = { key: 'root', storage: storageSession, }; export default function configureStore(initialState, helpersConfig) { const helpers = createHelpers(helpersConfig); const middleware = [thunk.withExtraArgument(helpers)]; let enhancer; if (__DEV__) { middleware.push(createLogger()); let devToolsExtension = f => f; if (process.env.BROWSER && window.devToolsExtension) { devToolsExtension = window.devToolsExtension(); } enhancer = compose(applyMiddleware(...middleware), devToolsExtension); } else { enhancer = applyMiddleware(...middleware);} const rootReducer = createRootReducer(); const persistedReducer = persistReducer(authPersistConfig, rootReducer); const store = createStore(persistedReducer, initialState, enhancer); if (__DEV__ && module.hot) { module.hot.accept('../reducers', () => if you change reducers back to normal rootReducer. store.replaceReducer(require('../reducers').default()), );} const persistor = persistStore(store); return { store, persistor }; }

Do i set it wrong?

part of client.js const { store, persistor } = configureStore(window.App.state, { apolloClient, fetch, history, });

const renderReactApp = isInitialRender ? ReactDOM.hydrate : ReactDOM.render; appInstance = renderReactApp( <App context={context}> <PersistGate loading={null} persistor={persistor}> {route.component} </PersistGate> </App>,container, () => { if (isInitialRender) { const elem = document.getElementById('css'); if (elem) elem.parentNode.removeChild(elem); return; } The PersistGate in server.js is same as client.js

About this issue

Original URL
State: open
Created 6 years ago
Reactions: 1
Comments: 23 (5 by maintainers)

Most upvoted comments

Temporary workaround is to check if action.payload is defined

export const app = (state = appDefaultState, action) => {
  switch (action.type) {
    case REHYDRATE:
      if (action.payload) { // <- I guess this works, but it's kinda ugly
        return {
          ...state,
          user: action.payload.user,
        };
      } else {
        return state;
      }

    ...

atav32 on Mar 1, 2018

are you using android? react native AsyncStorage has a bug with android when the debugger is open causing this to happen. As you can see the persist is timing out (check the error on the REHYDRATE action).

The only workaround for this is to use a different storage engine: https://github.com/rt2zz/redux-persist#storage-engines

rt2zz on Feb 13, 2018

@rt2zz I’m still still getting these issues, although they only seem to affect random devices. In my office there’s 10 of us using my app, and only 2 people seem to get this.

In my case, rehydrate only happens once, but payload and err are both empty. Is it perhaps a memory issue?

same issue, but in my case, it happens when hermes engine is enabled

DeVoresyah on Nov 13, 2020

I have the same issue.

Using version 5.9.1 I get an undefined payload if there’s nothing in localstorage (same with localForage).

mattmcdonald-uk on Mar 20, 2018

@rt2zz I’m still still getting these issues, although they only seem to affect random devices. In my office there’s 10 of us using my app, and only 2 people seem to get this.

In my case, rehydrate only happens once, but payload and err are both empty. Is it perhaps a memory issue?

MitchEff on Sep 25, 2019

@mattmcdonald-uk I just ended up doing this, https://egghead.io/lessons/javascript-redux-persisting-the-state-to-the-local-storage

atav32 on Mar 20, 2018