Programming Tutorials

expo-secure-store to store sensitive data securely in React Native

By: James in React-Native Tutorials on 2023-04-07  

expo-secure-store provides an API to securely store sensitive data such as authentication tokens, passwords, and other secrets. This library uses the operating system's secure storage mechanism to store the data.

Here's an example of how to use expo-secure-store to store a user's authentication token securely:

import * as SecureStore from 'expo-secure-store';

// Store the user's authentication token
const saveAuthToken = async (token) => {
  try {
    await SecureStore.setItemAsync('authToken', token);
    console.log('Token saved successfully');
  } catch (error) {
    console.log('Error saving token:', error);
  }
}

// Retrieve the user's authentication token
const getAuthToken = async () => {
  try {
    const token = await SecureStore.getItemAsync('authToken');
    if (token) {
      console.log('Token retrieved successfully');
      return token;
    } else {
      console.log('No token found');
      return null;
    }
  } catch (error) {
    console.log('Error retrieving token:', error);
    return null;
  }
}

// Delete the user's authentication token
const deleteAuthToken = async () => {
  try {
    await SecureStore.deleteItemAsync('authToken');
    console.log('Token deleted successfully');
  } catch (error) {
    console.log('Error deleting token:', error);
  }
}

In this example, we have defined three functions to save, retrieve, and delete the user's authentication token. The setItemAsync() method is used to securely store the token. The getItemAsync() method is used to retrieve the token. If the token is found, we return it; otherwise, we return null. The deleteItemAsync() method is used to delete the token from the secure storage.

It is important to note that the data stored using expo-secure-store is encrypted and can only be accessed by the same application that stored it. The data is also automatically cleared when the application is uninstalled.