Announcing the Capacitor Secure Preferences Plugin

Today we are excited to announce our brand new Capacitor Secure Preferences plugin. This plugin is a drop-in replacement for the official Capacitor Preferences plugin and allows you to securely store key/value pairs such as passwords, tokens or other sensitive information. The plugin provides cross-platform support for Android, iOS and Web and is now available to all Capawesome Insiders.

Let's take a quick look at the API and how to use the plugin in your Capacitor app.

Installation

See Getting started with Insiders and follow the instructions to install the plugin. After that, follow the platform-specific instructions in the Android section.

Usage

Let's take a look at the basic usage of the plugin. You can find the complete API reference in the API section of the documentation.

Set a value

You can set a value using the set method:

import { SecurePreferences } from '@capawesome-team/capacitor-secure-preferences';

const set = async () => {
  await SecurePreferences.set({
    key: 'password',
    value: '123456',
  });
};

The stored value can be any string. To store other types or more complex objects, you can use JSON.stringify() to convert them to a string before storing them and JSON.parse() to convert them back to their original form after retrieving them.

No encryption on Web

On Android and iOS, the value will be encrypted and stored securely on the device. On Web, the value will be stored unencrypted in localStorage since the web platform does not provide a secure storage solution. This is for development purposes only and should not be used in production.

Get a value

You can get a value using the get method:

import { SecurePreferences } from '@capawesome-team/capacitor-secure-preferences';

const get = async () => {
  const { value } = await SecurePreferences.get({ key: 'password' });
  console.log(value); // 123456
};

This will decrypt the value and return it as a string.

Remove a value

To remove a value, you can use the remove method:

import { SecurePreferences } from '@capawesome-team/capacitor-secure-preferences';

const remove = async () => {
  await SecurePreferences.remove({ key: 'password' });
};

Clear all values

If you want to clear all values, simply call the clear method:

import { SecurePreferences } from '@capawesome-team/capacitor-secure-preferences';

const clear = async () => {
  await SecurePreferences.clear();
};

Get all keys

And finally, if you want to get all stored keys, you can use the keys method:

import { SecurePreferences } from '@capawesome-team/capacitor-secure-preferences';

const getAllKeys = async () => {
  const { keys } = await SecurePreferences.keys();
  console.log(keys); // ['password']
};

Conclusion

We hope you are as excited as we are about the new Capacitor Secure Preferences plugin. Be sure to check out the API Reference to see what else you can do with this plugin. If you are missing any features, just create a feature request in the GitHub repository. Make sure you follow us on X so you don't miss any future updates.