Skip to main content

Signer Overview

The Signer is the security core of the Extra Wallet ecosystem. It is a standalone web application designed to run in complete isolation from the main app UI.

Architecture​

Extra Wallet ecosystem uses a split security model:

  1. App UI: The user-facing application. It has zero access to private keys.
  2. Signer: An iframe that manages all secrets and cryptographic operations.

This separation ensures that even if the main app UI is compromised (e.g., by a malicious extension or XSS attack), your private keys remain safe within the Signer's isolated memory space.

Key Responsibilities​

The Signer is responsible for:

  • Key Management: Generating and storing mnemonics and private keys.
  • Transaction Signing: Receiving transaction payloads, and producing valid signatures.
  • Secure Storage: Saving encrypted sensitive data using IndexedDB within its own origin.
  • Derivation: Deriving addresses and keys for various blockchain networks.

Module System​

The Signer is built on a modular architecture. Features are organized into modules (e.g., safeSigner, safeStorage) that are:

  • Lazy-loaded: Only the code needed for a specific operation is fetched.
  • Configurable: Modules can be enabled/disabled at build time (e.g., for offline-only builds).

Developer Info​

Simple Start​

  1. Install dependencies: Run nvm install (if needed) and nvm use, then yarn in the root directory.
  2. Configure Environment: Fill in .env:
    • VITE_PORT - 5001.
    • VITE_ALLOWED_ORIGINS - http://localhost:5173,http://localhost:5001. Comma separated list of signer and client origins.
    • BUILD_TARGET: offline or online.
  3. Start the main app: For example Extra Wallet UI.
  4. Start signer: Run yarn dev.

Build and Test​

To build the application for production:

# Build for online mode
yarn build:online

# Build for offline mode
yarn build:offline

What Happens During Build:

  1. Module Parsing: Scans module.config.ts files to determine which modules to include.
  2. App Build:
    • Bundles the application using Vite.
    • Outputs to the dist directory.

Preview:

Run yarn preview to serve the production build locally.

Source: Signer