How to store sensitive data in React Native or expo code ? ( with Keychain and Keystore )

Question

I saw a couple of questions asking about "How to store sensitive data en React Native" (like this and this), but, all of those cases were talking about taking some sensitive data dynamically (from a server, for example), and then storage it using AsyncStorage. But, what about if you need to WRITE a sensitive TOKEN/PASSWORD in the CODE?

For example, I want to implement this library: https://github.com/fullstackreact/react-native-oauth As you can see in the first example, I have to write in the code the secret token.

Is there a file in all the react-native project directory where I can put my tokens and then get it in the application? How much secure is to manipulate those secure tokens in the application?

Thanks

Answer 1

How to store sensitive data in React Native code?

The libraries

Now multiples libraries allow you to store sensitive in React Native code:

• expo-secure-store
• react-native-keychain
• react-native-encrypted-storage

Note: On the native side, theses libraries can use:

• Keychain for iOS
• Android Keystore for Android
• Encrypted Shared Preferences for Android

Example

Here is an example of usage with react-native-keychain to store sensitive data with react-native

For iOS it use Keychain Sharing Capabilities

For Android it use:

• API level 16-22 use Facebook Conceal
• API level 23+ use Android Keystore

You can use it like that:

// Generic Password, service argument optional
Keychain
  .setGenericPassword(username, password)
  .then(function() {
    console.log('Credentials saved successfully!');
  });

// service argument optional
Keychain
  .getGenericPassword()
  .then(function(credentials) {
    console.log('Credentials successfully loaded for user ' + credentials.username);
  }).catch(function(error) {
    console.log('Keychain couldn\'t be accessed! Maybe no value set?', error);
  });