Manage your two-factor authentication codes with a secure and decentralized solution powered by the Internet Computer.
Backend: migky-fiaaa-aaaap-anwya-cai
Frontend: mphmm-iqaaa-aaaap-anwyq-cai
🔗 Launch App
User authentication in a desktop application is more complex than standard in-browser authentication. The flow below is based on this guide, which describes a delegation-based approach for mobile and desktop integration using Internet Identity.
This implementation follows a more secure delegation pattern as recommended in Recommendation 6, where an intermediate identity is created during the authentication process via the web version (shown as a "secure proxy app" in the diagram below).
sequenceDiagram
actor U as User
participant DA as Desktop App
participant WA as Web App
participant II as Internet Identity
participant BE as Backend
autonumber
note over U,DA: User clicks "Sign in"
U ->> DA: Sign in
DA ->> DA: Generate session key pair
DA ->> WA: Open in browser <br/>`/delegation?sessionPublicKey=<br/>$sessionPublicKey`
WA ->> WA: Generate intermediate session key
Note over WA: This key never leaves<br/> the Web App front-end
WA ->> II: Standard II client auth protocol<br/>using intermediate session key
Note over WA,II: II will create a delegation for the<br/>intermediate key and not for the attacker<br/>chosen session key.
U ->> II: Authenticate with passkey
II -->> WA: Return the delegation<br/>using the postMessage API
WA ->> WA: Construct the delegation chain
Note over WA: The Web App front-end creates a<br/>delegation from the intermediate<br/> key to the desktop app session key<br/>and combines it with the<br/>delegation from the II canister key<br/>to the intermediate key.
WA -->> DA: Return the delegation chain
Note over WA,DA: Return the delegation chain to <br/>the desktop app using deep-link
DA ->> DA: Verify the delegation chain<br/>against the session<br/>key from step 2
U ->> DA: Authenticated call
DA ->> BE: Update call using the verified delegation chain
BE -->> DA: <<Response>>
To run this project locally, you'll need the following tools installed:
Start the project with:
docker compose upDuring initialization, the script installs all dependencies, builds the Internet Identity, backend, and frontend canisters. A Caddy-powered local HTTPS server is used. You'll need to generate and trust a local root certificate.
On macOS, run the following to install the Caddy CA certificate:
npm run install:caOnce running, Internet Identity will be available at:
https://rdmx6-jaaaa-aaaaa-aaadq-cai.localhost/
Other canisters will be available at https://<canister-id>.localhost.
In addition to the standard development and production modes, the project includes a third mode: staging. Here’s an overview:
To run the standard web version in development:
npm run startTo run the desktop version in development (Tauri):
npm run tauri devThis uses browser-based authentication via a frontend proxy and deep linking to return control to the desktop app. Note that macOS (and iOS/Android) does not support runtime deep link registration, which may complicate testing authentication. On Windows/Linux, this should work as expected.
Think of this as your application’s testnet. Every time you want to preview changes, you deploy to staging. Angular uses src/environments/environment.staging.ts for build-time config.
Update the frontend canister build script in dfx.json:
"ic-2fa-auth-frontend": {
"dependencies": ["ic-2fa-auth-backend"],
"source": ["dist/ic-2fa-auth/browser"],
"type": "assets",
- "build": ["npm run build"]
+ "build": ["npm run build:staging"]
},Then deploy:
docker compose exec backend dfx deploy ic-2fa-auth-frontendTo build the Tauri desktop app in staging mode:
npm run tauri:build:stagingTo enable WebView Console, modify src-tauri/Cargo.toml:
[dependencies]
-tauri = { version = "2.2.5", features = [] }
+tauri = { version = "2.2.5", features = ["devtools"] }Or install the CrabNebula DevTools plugin.
After you're done, shut down the development environment:
docker compose down- Dfinity Foundation for Internet Computer, Motoko, and 👽 tech
- Mops, ZhenyaUsenko for motoko-hash-map, sea-snake for the post
- Angular, Tailwind CSS, and community projects like spartan-ng, ngxtension
- Tauri and especially FabianLars for plugin development