Registry / security / react-secure-storage

react-secure-storage

library1.3.2jsnpmunverified

React Secure Storage (v1.3.2) is a wrapper around localStorage that encrypts stored data using a browser fingerprint and an optional user-provided secret key. It generates a unique encryption key per browser, ensuring data can only be decrypted in the same browser that encrypted it. Supports storing String, Object, Number, and Boolean without manual serialization. Uses a singleton pattern for in-memory caching. Works with React, Vite, and Next.js via environment variables. Lightweight and dependency-free. Compatible with TypeScript.

security

npm install react-secure-storage

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · REACT-SECURE-STORA

react-secure-storage

securityjavascriptv1.3.2

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

default

✓ import SecureStorage from 'react-secure-storage'

✗ import { SecureStorage } from 'react-secure-storage'

Library exports a default export; named import will result in undefined.

SecureStorage

✓ const SecureStorage = require('react-secure-storage').default

✗ const SecureStorage = require('react-secure-storage')

In CommonJS, require returns the module, not the default export. Must access .default.

setItem / getItem / removeItem / clear

✓ SecureStorage.setItem('key', value); const val = SecureStorage.getItem('key');

✗ SecureStorage.setItem('key', value, callback)

These methods are synchronous; no callback support.

Basic usage: importing the library, setting and getting items of different types, and clearing storage.

import React from 'react'; import ReactDOM from 'react-dom'; import SecureStorage from 'react-secure-storage'; // Optional: set hash key via environment variable (dotenv required for CRA) // REACT_APP_SECURE_LOCAL_STORAGE_HASH_KEY=mySecretKey // REACT_APP_SECURE_LOCAL_STORAGE_PREFIX=myApp_ // Store data (supports string, object, number, boolean) SecureStorage.setItem('token', 'abc123'); SecureStorage.setItem('user', { name: 'John', age: 30 }); SecureStorage.setItem('count', 42); SecureStorage.setItem('isActive', true); // Retrieve data const token = SecureStorage.getItem('token'); // 'abc123' const user = SecureStorage.getItem('user'); // { name: 'John', age: 30 } const count = SecureStorage.getItem('count'); // 42 const isActive = SecureStorage.getItem('isActive'); // true // Remove individual key SecureStorage.removeItem('token'); // Clear all secure storage data SecureStorage.clear(); function App() { return <div>Check console</div>; } ReactDOM.render(<App />, document.getElementById('root'));

Debug

Known issues

gotchaData stored with react-secure-storage can only be read by the same browser that wrote it; copying localStorage to another machine will not decrypt.

fix

This is by design; if cross-browser decryption is needed, use a static encryption key instead.

affects: >=1.0.0

gotchaIn Vite, process.env is not available; you must define environment variables via import.meta.env and configure vite.config to expose them.

fix

Use import.meta.env.VITE_SECURE_LOCAL_STORAGE_HASH_KEY and ensure prefix is VITE_.

affects: >=1.0.0

gotchaIf the hash key is not set via environment variable, a default key is used, reducing security.

fix

Always set SECURE_LOCAL_STORAGE_HASH_KEY (with appropriate prefix) to a strong secret.

affects: >=1.0.0

deprecatedOlder versions (<1.3.0) used a different encryption algorithm; data encrypted with older versions may not be decrypted by >=1.3.0.

fix

Upgrade to latest version and migrate data if necessary.

affects: <1.3.0

Errors

Common errors & fixes

TypeError: SecureStorage is not a function

Using named import (import { SecureStorage } ...) instead of default import.

fix

Use import SecureStorage from 'react-secure-storage'.

Uncaught ReferenceError: process is not defined

Using in Vite or browser environment without process polyfill.

fix

For Vite, use import.meta.env and define variables with VITE_ prefix.

TypeError: Cannot read properties of null (reading 'toString')

getItem returns null for missing keys; calling methods on null.

fix

Check returned value before using: const val = SecureStorage.getItem('key'); if (val !== null) { ... }

Upgrade

Version history

1.3.2latest on npm

Audit

Dependencies

No dependency data recorded yet.

Agent activity

23 hits · last 30 days

node

Resources

githubssh://git@github.com/sushinpv/react-secure-storage ↗

packagereact-secure-storage ↗

homepagehttps://github.com/sushinpv/react-secure-storage#readme ↗