ReactFix
  • Privacy Policy
  • TOS
  • Ask Question
  • Contact Us
  • Home
  • React
  • React Native
  • Programming
  • Object Oriented Programming

Tuesday, November 29, 2022

[FIXED] Where to store user's credentials in React Native Mobile App

 November 29, 2022     javascript, react-native, reactjs   

Issue

im have designed a complete mobile app. The user has to login with their credientails in order to access the app. However, I am unsure where to store the credentials once he/she signs in. I will be reusing the username throughout different screens in the app. Where can I store them and how can i access them? is there such thing as a global variable for instance?

Also, say a user logged in the first time. I want the user to be able to shut down the app. Once the user comes back, he/she should not be asked to reenter their credentials. How can that be done?

Thanks


Solution

Luckily, all these infos are available on the official React Native docs.

https://reactnative.dev/docs/security#storing-sensitive-info

For persisted user data, choose the right type of storage based on its sensitivity. As your app is used, you’ll often find the need to save data on the device, whether to support your app being used offline, cut down on network requests or save your user’s access token between sessions so they wouldn’t have to re-authenticate each time they use the app.

The usual way to achieve that is by using the secure storage of each platform.

iOS - Keychain Services

Keychain Services allows you to securely store small chunks of sensitive info for the user. This is an ideal place to store certificates, tokens, passwords, and any other sensitive information that doesn’t belong in Async Storage.

Android - Secure Shared Preferences

Shared Preferences is the Android equivalent for a persistent key-value data store. Data in Shared Preferences is not encrypted by default, but Encrypted Shared Preferences wraps the Shared Preferences class for Android, and automatically encrypts keys and values.

Android - Keystore

The Android Keystore system lets you store cryptographic keys in a container to make it more difficult to extract from the device.

In order to use iOS Keychain services or Android Secure Shared Preferences, you can either write a bridge yourself or use a library which wraps them for you and provides a unified API at your own risk. Some libraries to consider:

  • expo-secure-store

  • react-native-keychain

  • react-native-sensitive-info - secure for iOS, but uses Android Shared Preferences for Android (which is not secure by default). There is however a branch that uses Android Keystore.

  • redux-persist-sensitive-storage - wraps react-native-sensitive-info for Redux.

More on that here: https://reactnative.dev/docs/security#secure-storage



Answered By - Treycos
Answer Checked By - - Marie Seifert (ReactFix Admin)
  • Share This:  
  •  Facebook
  •  Twitter
  •  Google+
  •  Stumble
  •  Digg
Newer Post Older Post Home

Featured Post

Is Learning React Difficult?

React is difficult to learn, no ifs and buts. React isn't inherently difficult to learn. It's a framework that's different from ...

Total Pageviews

Copyright © ReactFix