redux-persist
redux-persist copied to clipboard
redux-presist not working with android
So I have just started an expo project, and I am using redux-presist. My problem is that the state is loading fine on ios. But it's not working on android. When I save my code with live reload it is working fine. But when I restart the app it is not getting the storage data. It is only getting it when I save a change in the code (so when it live reloads). There are no problems on IOS.
this is my store.js:
import {combineReducers, configureStore} from '@reduxjs/toolkit'
import {setFirstname, userSlice} from "./user/userSlice";
import AsyncStorage from '@react-native-async-storage/async-storage';
import { persistStore, persistReducer } from 'redux-persist'
import {FLUSH, PAUSE, PERSIST, PURGE, REGISTER, REHYDRATE} from "redux-persist/es/constants";
const persistConfig = {
key: 'root',
storage: AsyncStorage,
}
const persistedReducer = persistReducer(persistConfig, userSlice.reducer)
export const store = configureStore({
reducer: persistedReducer,
middleware: (getDefaultMiddleware) =>
getDefaultMiddleware({
serializableCheck: {
ignoredActions: [FLUSH, REHYDRATE, PAUSE, PERSIST, PURGE, REGISTER],
},
}),
})
export const persistor = persistStore(store)
export default store
And this is my app.js
import { StatusBar } from 'expo-status-bar';
import { StyleSheet } from 'react-native';
import React, {useEffect, useState} from 'react';
import BottomNav from "./app/navigations/BottomNav";
import 'react-native-gesture-handler'
import StackNav from "./app/navigations/StackNav";
import {NavigationContainer} from "@react-navigation/native";
import {navigationRef} from "./app/navigations/RootNavigation";
import {Provider} from "react-redux";
import {persistor, store} from "./app/store/store";
import {PersistGate} from "redux-persist/integration/react";
import SpinningLogo from "./app/ui/SpinningLogo";
export default function App() {
const [isAuth, setAuth] = useState(null)
useEffect(() => {
console.log(store.getState().userToken)
if (store.getState().userToken){
setAuth(true)
}
})
return (
<Provider store={store}>
<PersistGate loading={<SpinningLogo/>} persistor={persistor}>
<NavigationContainer ref={navigationRef}>
<StatusBar style="light" />
{isAuth ? (
<BottomNav/>
): <StackNav />}
</NavigationContainer>
</PersistGate>
</Provider>
);
}
const styles = StyleSheet.create({
container: {
},
});
We've run into the same problem with Android. Has anyone had any luck addressing it? Zero-ing to null-ing the timeout value hasn't worked.
@mdescalzo I did not find any solutions, I am just storing it some data in my local storage now. I wanted to use redux to store and retrieve my user-token. At the moment I am retrieving it with AsyncStorage, it's a bit uglier in my opinion, but it does the job. Please let me know if you find a working solution!
We're using it to persist user settings. It was working smoothly for months, but stopped recently. We haven't yet sorted a solution. We may have to more directly implement AsyncStorage, but that will get ugly. We may consider something like redux-localstorage-simple.
@Moemen02 I just figured out how to get it working on our project. We were running into storage limit issues. I removed our largest reducer from the whitelist and it started working again. Are you storing your entire state redux state object? Trying using the whitelist to persist only the userToken.
Yes. I also needed AsyncStorage_db_size_in_MB=500 in my gradle.properties And this: https://github.com/react-native-async-storage/async-storage/issues/537#issuecomment-781047700
I have run into the same problem with Android, and I solve it by increasing the storage size of asyncStorage You can use this code https://github.com/react-native-async-storage/async-storage/issues/537#issuecomment-781047700
import android.database.CursorWindow; import java.lang.reflect.Field;
I've fixed the same below It worked and hopefully yours can too
import java.lang.reflect.Field;
import android.database.CursorWindow;
try {
Field field = CursorWindow.class.getDeclaredField("sCursorWindowSize");
field.setAccessible(true);
field.set(null, 500 * 1024 * 1024); //500MB
} catch (Exception e) {
if (BuildConfig.DEBUG) {
e.printStackTrace();
}
}
ref: https://github.com/react-native-async-storage/async-storage/issues/537#issuecomment-781047700
Give a try to my library
https://github.com/Redux-Utils/react-native-redux-persist/
I made it especially for react-native and expo.
So far you can use AsyncStorage and Expo Secure Store