--- description: Use the Capacitor Biometrics plugin and Secure Preferences to store credentials and authenticate with Face ID or fingerprint on Android and iOS. title: How to Securely Store Credentials with Capacitor - Capawesome image: https://capawesome.io/docs/assets/images/social/blog/how-to-securely-store-credentials-with-capacitor.png --- [ Skip to content](#how-to-securely-store-credentials-with-capacitor) [ πŸ” Introducing the **Capacitor Vault** plugin β€” store secrets behind biometrics or a device passcode.](/blog/announcing-the-capacitor-vault-plugin/) * [ SDKs ](/docs/sdks/) * [ Formbricks ](/docs/sdks/capacitor/formbricks/) * [ Geocoder ](/docs/sdks/capacitor/geocoder/) * [ Google Sign-In ](/docs/sdks/capacitor/google-sign-in/) * [ Grafana Faro ](/docs/sdks/capacitor/grafana-faro/) * [ libSQL ](/docs/sdks/capacitor/libsql/) * [ Live Update ](/docs/sdks/capacitor/live-update/) * [ Managed Configurations ](/docs/sdks/capacitor/managed-configurations/) * [ Media Session ](/docs/sdks/capacitor/media-session/) * [ ML Kit ](/docs/sdks/capacitor/mlkit/) * [ Navigation Bar ](/docs/sdks/capacitor/navigation-bar/) * [ NFC ](/docs/sdks/capacitor/nfc/) * [ OAuth ](/docs/sdks/capacitor/oauth/) * [ Pedometer ](/docs/sdks/capacitor/pedometer/) * [ Photo Editor ](/docs/sdks/capacitor/photo-editor/) * [ PostHog ](/docs/sdks/capacitor/posthog/) * [ Printer ](/docs/sdks/capacitor/printer/) * [ Purchases ](/docs/sdks/capacitor/purchases/) * [ RealtimeKit ](/docs/sdks/capacitor/realtimekit/) * [ Screen Orientation ](/docs/sdks/capacitor/screen-orientation/) * [ Screenshot ](/docs/sdks/capacitor/screenshot/) * [ Secure Preferences ](/docs/sdks/capacitor/secure-preferences/) * [ Speech Recognition ](/docs/sdks/capacitor/speech-recognition/) * [ Speech Synthesis ](/docs/sdks/capacitor/speech-synthesis/) * [ Share Target ](/docs/sdks/capacitor/share-target/) * [ Square Mobile Payments ](/docs/sdks/capacitor/square-mobile-payments/) * [ SQLite ](/docs/sdks/capacitor/sqlite/) * [ Superwall ](/docs/sdks/capacitor/superwall/) * [ Torch ](/docs/sdks/capacitor/torch/) * [ Vault ](/docs/sdks/capacitor/vault/) * [ Wifi ](/docs/sdks/capacitor/wifi/) * [ Zip ](/docs/sdks/capacitor/zip/) * [ Cordova ](/docs/sdks/cordova/) * [ Cloud ](/docs/cloud/) * [ Integrations ](/docs/cloud/live-updates/integrations/) * Concepts * Reference * [ Troubleshooting ](/docs/cloud/live-updates/troubleshooting/) * [ FAQ ](/docs/cloud/live-updates/faq/) * [ Native Builds ](/docs/cloud/native-builds/) * [ Set Up Environments ](/docs/cloud/native-builds/environments/) * [ Overwrite Native Configurations ](/docs/cloud/native-builds/native-configurations/) * [ Auto-Increment Build Numbers ](/docs/cloud/native-builds/auto-incrementing-build-numbers/) * [ Configure the Web Build Script ](/docs/cloud/native-builds/web-build-script/) * [ Build from a Monorepo ](/docs/cloud/native-builds/monorepo/) * [ Use pnpm or Yarn ](/docs/cloud/native-builds/package-managers/) * [ Install Private npm Packages ](/docs/cloud/native-builds/npm-private-registry/) * [ Override the Java Version ](/docs/cloud/native-builds/override-java-version/) * [ Custom iOS Provisioning Profiles ](/docs/cloud/native-builds/custom-ios-provisioning-profiles/) * [ Build without Git ](/docs/cloud/native-builds/build-without-git/) * [ Access Git Behind a Firewall ](/docs/cloud/native-builds/firewall-access/) * [ Integrations ](/docs/cloud/native-builds/integrations/) * Reference * [ Troubleshooting ](/docs/cloud/native-builds/troubleshooting/) * [ FAQ ](/docs/cloud/native-builds/faq/) * [ App Store Publishing ](/docs/cloud/app-store-publishing/) * [ Submit a Build ](/docs/cloud/app-store-publishing/submit-a-build/) * [ Submit Automatically After a Build ](/docs/cloud/app-store-publishing/submit-automatically/) * [ Troubleshooting ](/docs/cloud/app-store-publishing/troubleshooting/) * [ FAQ ](/docs/cloud/app-store-publishing/faq/) * [ Automations ](/docs/cloud/automations/) * [ Reference ](/docs/cloud/automations/reference/) * [ Troubleshooting ](/docs/cloud/automations/troubleshooting/) * [ FAQ ](/docs/cloud/automations/faq/) * [ Assist ](/docs/cloud/assist/) * [ CLI ](/docs/cloud/cli/) * APIs and SDKs * [ Webhooks ](/docs/cloud/webhooks/) * [ Integrations ](/docs/cloud/integrations/) * Account * [ Organization ](/docs/cloud/organizations/) * [ Two-Factor Enforcement ](/docs/cloud/organizations/two-factor-authentication/) * [ Audit Logs ](/docs/cloud/organizations/audit-logs/) * [ Billing ](/docs/cloud/organizations/billing/) * [ License Keys ](/docs/cloud/license-keys/) * [ AI ](/docs/ai/) * [ Insiders ](/docs/insiders/) * [ Billing & Plans ](/docs/insiders/billing-and-plans/) * [ FAQ ](/docs/insiders/faq/) * [ License ](https://capawesome.io/legal/eula/) * [ Support ](/docs/support/) * [ Contributing ](/docs/contributing/) * Contributing code * [ Code of Conduct ](/docs/contributing/code-of-conduct/) * [ Questions ](https://docs.github.com/en/discussions/collaborating-with-your-community-using-discussions/participating-in-a-discussion#creating-a-discussion) * [ Blog ](/blog/) * Categories * [ Usage ](#usage) * [ Conclusion ](#conclusion) * Related links # How to Securely Store Credentials with Capacitor[ΒΆ](#how-to-securely-store-credentials-with-capacitor "Permanent link") A common requirement for mobile apps is secure storage of credentials (passwords, tokens, API keys) and user authentication via **biometrics** (fingerprint, Face ID). With Ionic's Identity Vault and Secure Storage [no longer maintained](https://ionic.io/blog/important-announcement-the-future-of-ionics-commercial-products), you can achieve the same with the [Capacitor Biometrics plugin](/docs/sdks/capacitor/biometrics/) and [Capacitor Secure Preferences plugin](/docs/sdks/capacitor/secure-preferences/). For a complete walkthrough on the Biometrcis plugin make sure to read [Exploring the Capacitor Biometrics API](/blog/exploring-the-capacitor-biometrics-api/). ## Introduction[ΒΆ](#introduction "Permanent link") In this guide, we will show you how to securely store credentials and authenticate users using the Capacitor Biometrics and Secure Preferences plugins. This solution is cross-platform and works on both Android and iOS. ## Installation[ΒΆ](#installation "Permanent link") First, you need to install these two plugins in your Capacitor app. ### Biometrics[ΒΆ](#biometrics "Permanent link") Refer to [Getting Started with Insiders](/docs/insiders/getting-started/?plugin=capacitor-biometrics) and follow the instructions to install the plugin. After installation, follow the platform-specific instructions in the [Android](/docs/sdks/capacitor/biometrics/#android) and [iOS](/docs/sdks/capacitor/biometrics/#ios) sections. ### Secure Preferences[ΒΆ](#secure-preferences "Permanent link") Refer to [Getting Started with Insiders](/docs/insiders/getting-started/?plugin=capacitor-secure-preferences) and follow the instructions to install the plugin. After installation, follow the platform-specific instructions in the [Android](/docs/sdks/capacitor/secure-preferences/#android) section. ## Usage[ΒΆ](#usage "Permanent link") The following example demonstrates how to use the plugins to securely store credentials and authenticate users with biometrics. ### Storing Credentials[ΒΆ](#storing-credentials "Permanent link") First, we need to implement the functionality for storing credentials. The example below shows how to sign in a user with a username and password and securely store the credentials: `[](#%5F%5Fcodelineno-0-1)import { SecurePreferences } from '@capawesome-team/capacitor-secure-preferences'; [](#%5F%5Fcodelineno-0-2) [](#%5F%5Fcodelineno-0-3)const signInWithCredentials = async (username: string, password: string) => { [](#%5F%5Fcodelineno-0-4) const isValid = validateCredentials(username, password); [](#%5F%5Fcodelineno-0-5) if (isValid) { [](#%5F%5Fcodelineno-0-6) await storeCredentials(username, password); [](#%5F%5Fcodelineno-0-7) return true; [](#%5F%5Fcodelineno-0-8) } else { [](#%5F%5Fcodelineno-0-9) return false; [](#%5F%5Fcodelineno-0-10) } [](#%5F%5Fcodelineno-0-11)}; [](#%5F%5Fcodelineno-0-12) [](#%5F%5Fcodelineno-0-13)const validateCredentials = (username: string, password: string): boolean => { [](#%5F%5Fcodelineno-0-14) // Validate the credentials (e.g. perform a network request to your backend). [](#%5F%5Fcodelineno-0-15) return username === 'user' && password === 'password'; [](#%5F%5Fcodelineno-0-16)}; [](#%5F%5Fcodelineno-0-17) [](#%5F%5Fcodelineno-0-18)const storeCredentials = async (username: string, password: string) => { [](#%5F%5Fcodelineno-0-19) // Recommended: Prompt the user for biometric authentication before storing the credentials. [](#%5F%5Fcodelineno-0-20) await SecurePreferences.set({ [](#%5F%5Fcodelineno-0-21) key: 'credentials', [](#%5F%5Fcodelineno-0-22) value: JSON.stringify({ username, password }), [](#%5F%5Fcodelineno-0-23) }); [](#%5F%5Fcodelineno-0-24)}; ` The `signInWithCredentials(...)` function first validates the credentials and then securely stores them using the [set(...)](/docs/sdks/capacitor/secure-preferences/#set) method of the Secure Preferences plugin. The credentials are stored as a JSON string because the Secure Preferences plugin only accepts strings as values. The `validateCredentials()` function is a placeholder for your own logic to validate the credentials, such as making a network request to your backend. You should replace it with your own implementation. ### Retrieving Credentials[ΒΆ](#retrieving-credentials "Permanent link") Next, we need to implement the functionality for retrieving credentials and authenticating the user with biometrics. The `signInWithBiometrics(...)` function first checks if credentials are stored and then authenticates the user with biometrics using the Biometrics plugin: `[](#%5F%5Fcodelineno-1-1)import { Biometrics, ErrorCode } from '@capawesome-team/capacitor-biometrics'; [](#%5F%5Fcodelineno-1-2)import { SecurePreferences } from '@capawesome-team/capacitor-secure-preferences'; [](#%5F%5Fcodelineno-1-3) [](#%5F%5Fcodelineno-1-4)const signInWithBiometrics = async () => { [](#%5F%5Fcodelineno-1-5) const areCredentialsStored = await areCredentialsStored(); [](#%5F%5Fcodelineno-1-6) if (!areCredentialsStored) { [](#%5F%5Fcodelineno-1-7) return false; [](#%5F%5Fcodelineno-1-8) } [](#%5F%5Fcodelineno-1-9) try { [](#%5F%5Fcodelineno-1-10) await Biometrics.authenticate(); [](#%5F%5Fcodelineno-1-11) } catch (error) { [](#%5F%5Fcodelineno-1-12) return false; [](#%5F%5Fcodelineno-1-13) } [](#%5F%5Fcodelineno-1-14) const credentials = await retrieveCredentials(); [](#%5F%5Fcodelineno-1-15) return signInWithCredentials(credentials.username, credentials.password); [](#%5F%5Fcodelineno-1-16)}; [](#%5F%5Fcodelineno-1-17) [](#%5F%5Fcodelineno-1-18)const areCredentialsStored = async () => { [](#%5F%5Fcodelineno-1-19) const { value } = await SecurePreferences.get({ key: 'credentials' }); [](#%5F%5Fcodelineno-1-20) return !!value; [](#%5F%5Fcodelineno-1-21)}; [](#%5F%5Fcodelineno-1-22) [](#%5F%5Fcodelineno-1-23)const retrieveCredentials = async () => { [](#%5F%5Fcodelineno-1-24) const { value } = await SecurePreferences.get({ key: 'credentials' }); [](#%5F%5Fcodelineno-1-25) return JSON.parse(value); [](#%5F%5Fcodelineno-1-26)}; ` If biometric authentication is successful, the credentials are retrieved from the Secure Preferences plugin using the [get(...)](/docs/sdks/capacitor/secure-preferences/#get) method and passed to the `signInWithCredentials(...)` function to sign in the user. If authentication fails, the function simply returns `false`. ## Conclusion[ΒΆ](#conclusion "Permanent link") This guide showed how to store credentials and authenticate users with the [Capacitor Biometrics plugin](/docs/sdks/capacitor/biometrics/) and [Capacitor Secure Preferences plugin](/docs/sdks/capacitor/secure-preferences/). Please note that this is a basic example β€” adapt it to your requirements and consider prompting for biometric authentication before storing credentials. For the full plugin documentation, see the [API Reference](/docs/sdks/capacitor/biometrics/#api). **Additional resources:** * [Capacitor Biometrics Demo App](https://github.com/capawesome-team/capacitor-biometrics-demo) * [Step-by-step video](https://www.youtube.com/watch?v=ixUvTX6n7x8) **Related reading:** * [Exploring the Capacitor Biometrics API](/blog/exploring-the-capacitor-biometrics-api/) * [Announcing the Capacitor Biometrics Plugin](/blog/announcing-the-capacitor-biometrics-plugin/) * [Alternative to the Ionic Identity Vault plugin](/blog/alternative-to-ionic-identity-vault-plugin/) Follow [Capawesome on X](https://twitter.com/capawesomeio) and subscribe to the [Capawesome newsletter](/newsletter/) to stay updated. June 8, 2026 Back to top