Redux-persist: purge() doesn't work

[rico345100]

Hello. Using persistor.purge doesn't clear any data in my storage.

Here's the code:

const persistor = getPersistor();
await persistor.purge();

getPersistor() function returns persistor, and I called purge function but still nothing changed in my storage.

I also tried this code as well, but doesn't worked either:

const persistor = getPersistor();
await persistor.purge();
await persistor.flush();
await persistor.persist();

It seems like purge doesn't work. Used @5.10.0.

[Trashpants]

I was confused by this too - not sure if you fixed it by now, but for any people who stumble across this in the future: in order for this to work you have to make sure there is a PURGE action for each reducer that returns your 'clean' state. Then your commands of purge(), flush() will clear and force save the changes.

For reference I am coding with react-native (so I assume this is the same for react)

what's confusing is that if you immediately call purge() after setting up the persistor in store.js it will clear it on boot as expected

[chiaberry]

@Trashpants, can you elaborate on what a PURGE action is for each reducer? Is the data being erased from the disk, but not in redux? I cannot tell if I'm running into the same issues you are describing. thanks in advance

[chiaberry]

When I run

persistor.purge()
     .then(response => console.log(response))

response comes back as null, is that expected?

[Trashpants]

@chiaberry I have multiple reducers implemented with a PURGE case as

import { PURGE } from "redux-persist";

const INITIAL_STATE = {
  token: "",
  loading: false,
  user: {}
};

export default (state = INITIAL_STATE, action) => {
  switch (action.type) {
    case PURGE:
      return INITIAL_STATE;
    }
 };

that way when I call persistor.purge() its actually setting my state back to INITIAL_STATE

[chiaberry]

@Trashpants awesome! thank you

[jfbloom22]

I was having a similar issue, but after I implemented perge() I was still having issues. It turned out to be a race condition where some other action would write to state and trigger persisting data that I expected to be cleared. If a user logged out while an API call was loading, it would cause fun issues. I ended up with:

persistor.purge()
.then(() => {
return persistor.flush()
})
.then(() => {
persistor.pause()
})

[marko-ignjatovic]

When I run

persistor.purge()
     .then(response => console.log(response))

response comes back as null, is that expected?

And I am getting undefined

[jfbloom22]

@lolz42 that is expected. The function does not return anything besides a promise. https://github.com/rt2zz/redux-persist/blob/f6f6d642fb3e3f32544189a336442726344f323a/src/persistStore.js#L95

[Phoenix1708]

`` persistor.pause() persistor.flush().then(() => { return persistor.purge() }) ```` and then depends on your app logic resume it by persistor.persist()`

e.g in login page ?

[EternalChildren]

i have the same problem. when i upgrade the app
the redux state is older. i think the persistStore make it.
but nothing happened after persistor.purge()

persistor.pause()
persistor.flush().then(() => { return persistor.purge() })

not work for me.
who have the better solutions?

[tparesi]

I ran into a similar situation and need to enable remote debugging to have resistor.purge() work as expected on React Native using expo.

[titulus]

await persistor.purge();
await persistor.purge();

works for me!

[karland]

Works for me:

    const purge = () => {
      persistor.purge()
      console.log("Factory reset performed.")
    }

    <button onClick={() => purge()} >Purge</button>

Does NOT work for me:

    const purge = () => {
      persistor.purge()
      console.log("Factory reset performed.")
    }

    purge()

Also does NOT work for me:

    const purge = async () => {
      await persistor.purge()
      console.log("Factory reset performed.")
    }

    purge()

Solution from @titulus also works for me

    const purge = async () => {
      await persistor.purge()
      await persistor.purge()
      console.log("Factory reset performed.")
    }

    purge()

Alternative solution also works for me:

    const purge = () => {
      persistor.purge()
      console.log("Factory reset performed.")
    }

    setTimeout(() => purge(), 200)

I played around with the delay and it seems to need at least 100ms.

[gleidsonh]

I just did

setTimeout(() => persistor.purge(), 200)

and works great.

[lsmolic]

in all seriousness, I think I found the fix. You all want me to submit a PR?

// FiXeD iT
await persistor.purge();
await persistor.purge();
await persistor.purge();
await persistor.purge();
await persistor.purge();
await persistor.purge();
await persistor.purge();

[manikbajaj]

Strangely it's working with a setTimeout() as posted by @gleidsonh. This needs to be fixed. I was using this in generator with yield in redux-saga and yet somehow promise doesn't return true.

setTimeout(() => persistor.purge(), 200)

I just did

setTimeout(() => persistor.purge(), 200)

and works great.

[gkatsanos]

I don't understand most of the comments. persistore.purge() as it's clearing localStorage has to be a promise / async. You can await it inside an async function and I'd use a try/catch as well:

export let logout = () => async (dispatch) => {

  try {
    await persistor.purge();
    dispatch(logoutSucceed());
  } catch (err) {
    dispatch(logoutFailed(err));
  }
};

I assume just doing persister.purge() without awaiting or without .then(() => /*do something*/) isn't gonna work.
I guess the documentation could have some more examples.

[bcjohnblue]

I am implement redux-persist with redux-saga. I found it clear the localStorage and redux state all together well.

redux-persist version: 6.0.0

import { persistor } from 'src/store' // Self create persistor

export function* logoutSaga() {
  // logoutRequestSuccess() is responsible for clearing the redux state
  yield all([call(persistor.purge), put(logoutRequestSuccess())])
}