I have checked many links and found that AsyncStorage is the best way to store any data but it is a persistent way. I just need to know if there is any other way to store session data which can should be available for a particular session like when a user logs in to my app.
In my use case, the user logs in with credentials and then we need user specific data to be displayed anywhere we need, like other screens. Any other way apart from Asyn Storage should I be using?
I would recommend libraries react-native-keychain, realm or sqllite
https://github.com/oblador/react-native-keychain
https://realm.io/products/realm-database
https://github.com/andpor/react-native-sqlite-storage
I hope the following article will help you to learn about these libraries and alternatives.
https://www.simform.com/react-native-database-selection-guide/
Hope this will help.
So, if you are not using redux you can either use Asyncstorage or sqlite or realm.
I would still prefer using Async storage as its persistant.
So what your problem statement looks like is a global value which can be displayed all over the app based on user session.
So when a user logins, you can set the Asyncstorage as
await AsyncStorage.setItem('#storage_Key', value)
and when you want to retrieve :
const value = await AsyncStorage.getItem('#storage_Key')
and suppose when the user logs out so you want to delete the async storage value as thats related with that user, you simply call the below on logout :
await AsyncStorage.removeItem('#storage_Key')
Hope it helps. feel free for doubts
Related
I am currently building an app using the following
Next.js
Express API
Redux-Toolkit & RTK Query
I have all of the authentication logic implemented, but have ran into an issue.
So, upon successful login, the express api returns 2 httponly cookies containing the access/refresh tokens.
I have an endpoint in my api to get the current user using the access token i.e /api/auth/me
This all works fine, but what I can't figure out is the best way to fetch the user on each page load and store them in the redux state.
Do I use RTK Query to hit the /api/auth/me endpoint and just call the query whenever I need it throughout the app?
Ideally I fetch and set the user in _app.tsx, but I cannot use redux dispatch since it's outside of the <Provider store={store}></Provider>
Also for example if I wanted to use the redux stored user in getServerSideProps I can't seem to do that either because it's not client side and doesn't have access to redux.
I just can't seem to find a good way to simply set the authenticated user and be able to use them globally throughout the app whether it's inside redux store or in something like getServerSideProps.
Any advice would be truly amazing, I am totally lost.
One way of persisting authentication state is storing the token in the local storage. And in the main App component you can check whether the token is present in the redux store. If it's not there you can set it manually in useEffect function.
As such:
useEffect(() => {
fetchAuthTokenFromLocalStorage().then((token) => {
dispatch(setAuthenticationResult(token));
});},[dispatch]);
I want to know if there are any strategies (and especially for React-Native apps) to
The first time the app is run (or even during installation), make a GET call to an API;
Store the recieved data (using AsyncStorage for example);
When the app doesn't have any internet connection, just use the stored data;
If however, the device is connected first check if there has been any update to the API data;
If so, update the stored data; otherwise just use the stored data.
PS: I need this for a "slow-evolving" data and I want this for two reasons:
Allow users to use the app even without internet connection;
Avoid multiple "useless" API calls.
Thank you,
You can use redux and redux-persist.
Call API request once when app is opened.
If there is internet connection it will populate redux state with new data.
Otherwise, the current data from redux state will be displayed.
I am new to react-native and redux. I have successfully created a login function which calls a post-request api. The credentials insert by a user are matric no and password. I have another post-method api need to be called to display a list of data in another page after the user successfully logged on. However I dunno how to pass the matric no to another page since there is no event that ought to trigger the user to enter their matric no i order to call the post-method api. Can somebody help me how to solve this?
Use Redux Store or AsyncStorage to store important login information like token or your matrix no.
Retrieve on next page in componentWillMount() and send to Ajax to validate and get data.
ref : https://facebook.github.io/react-native/docs/asyncstorage.html
you might want to use react redux. Using this u can acess anything from anywhere fast and simple.
Its a little hard to setup but once u have setup its easy to manage and u get info anywhere in the app refer this link: Getting started with Redux.
It covers different aspects of using redux. Starting off with a simple example of counter. It also deals with how to manage an api call where the result can be accessed anywhere from the app.
Good luck!
I'm figuring out the data-flow, and writing action oriented code to deal with Redux.
This is the flow:
I reach SplashScreen and check if accessToken exists. If no, I send the user to LoginScreen. Else, I take him to the HomeScreen.
The flow is rather simple but I'm not able to wrap my head around how to store the token, expire the token or just check if user is logged in. So, technically, when a user logs in, the state(access token) should change. I'm not asking for code, just some pseudo-code and a little explanation will help!
If you want to user the redux store to save token or any user credentials you will need to ensure the state is saved on localStorage, and for that you can use a redux middleware like this or this, or you can use middle-ware of your own :
export default store => next => action => {
let result = next(action)
localStorage.state = JSON.stringify(store.getState())
return result
}
I don't know if you are using react router, If you are, take a look at this example: authenticator I think it's really the best way to do it..
In my app I used react-native-keychain. When a user logs in, I store the accessToken in the redux store. From there, any time I'm making a request, I just get the token from the store, ensure that it's valid, and make the request.
Can anyone explain how asyncStorage works ? Is it connected to database like SQLite or RocksDB ? Does asyncstorage write data to database directly ?
AsyncStorage is a simple, unencrypted, asynchronous, persistent, key-value storage system that is global to the app. It should be used instead of LocalStorage.
It's use full when you want to use some variable globally in App.
e.g like when you login first time in app the store the login id and password for next time it will take data from AsyncStorage and logged in successfully..
Refer this link