Utilizza @capgo/capacitor-passkey

Mantieni il tuo browser-style WebAuthn code in un'applicazione Capacitor mentre il plugin gestisce le chiamate native di passkey e il patching del host nativo.

Browser-style API

@capgo/capacitor-passkey La __CAPGO_KEEP_0__ mantiene lo stesso flusso WebAuthn che già usi sul web:

await navigator.credentials.create({ publicKey: registrationOptions });
await navigator.credentials.get({ publicKey: requestOptions });

Sulla costruzione nativa, il plugin installa un shim per navigator.credentials.create() E navigator.credentials.get()e invia la richiesta alle API di passkey iOS e Android, e restituisce oggetti di credenziali browser-like al tuo'applicazione.

Installa e sincronizza progetti nativi

bun add @capgo/capacitor-passkey
bunx cap sync

Configura l'applicazione host una volta

Aggiungi la configurazione del plugin in capacitor.config.ts o capacitor.config.json:

import type { CapacitorConfig } from '@capacitor/cli';

const config: CapacitorConfig = {
  appId: 'app.capgo.passkey.example',
  appName: 'My App',
  webDir: 'dist',
  plugins: {
    CapacitorPasskey: {
      origin: 'https://signin.example.com',
      autoShim: true,
      domains: ['signin.example.com'],
    },
  },
};

export default config;

Cosa fa la configurazione del plugin

La configurazione viene letta da plugins.CapacitorPasskey in capacitor.config.*.

origin: origine HTTPS di rete primaria utilizzata dal shim e diretto API
domains: hostnames di rete aggiuntivi da integrare nella configurazione nativa durante la sincronizzazione
autoShim: predefinito su true e controlla la configurazione nativa cap sync hook di auto-configurazione

Esegui nuovamente la sincronizzazione dopo aver modificato la configurazione:

bunx cap sync

Installa il shim durante l'avvio

Importa il plugin dall'ingresso standard del pacchetto, quindi installa il shim durante l'avvio dell'app:

import { CapacitorPasskey } from '@capgo/capacitor-passkey';

await CapacitorPasskey.autoShimWebAuthn();

After that, your existing browser-style passkey code can stay the same.

Se avete bisogno di forzare il shim o sovrascrivere l'origine configurata in esecuzione, chiamate:

import { CapacitorPasskey } from '@capgo/capacitor-passkey';

CapacitorPasskey.shimWebAuthn({
  origin: 'https://signin.example.com',
});

Conservate il vostro flusso WebAuthn normale

const credential = await navigator.credentials.create({
  publicKey: registrationOptions,
});

const assertion = await navigator.credentials.get({
  publicKey: requestOptions,
});

Cosa sincronizza per voi

Durante bunx cap sync, il plugin aggiorna i progetti host nativi generati:

iOS: autorizzazioni di dominio associato e autorizzazioni Xcode quando necessario
Android: asset_statements metadati e il risorsa generata utilizzata dal manifesto

Il setup nativo richiede ancora i file di fiducia del sito web

Il plugin riduce il lavoro sul lato applicazione, ma i passkey dipendono ancora dai file di fiducia del sito web per il vostro dominio di parte di riferimento. Avete ancora bisogno di ospitare:

https://your-domain/.well-known/apple-app-site-association
https://your-domain/.well-known/assetlinks.json

Il plugin può patchare i progetti host nativi generati durante la sincronizzazione, ma non può creare o ospitare questi file di fiducia del sito web per voi.

Metodi pubblici diversi

Anche il plugin pubblico API espone gli aiuti diretti definiti in src/definitions.ts:

await CapacitorPasskey.getConfiguration() ritorna la risoluzione origin, domains, autoShim, e corrente platform.
await CapacitorPasskey.createCredential(...) registra una chiave pass da un payload WebAuthn sicuro JSON.
await CapacitorPasskey.getCredential(...) si autentica con una chiave pass esistente da un payload WebAuthn sicuro JSON.
await CapacitorPasskey.isSupported() riferisce se il runtime corrente supporta le chiavi pass.
await CapacitorPasskey.getPluginVersion() ritorna la versione di marcatura dell'implementazione nativa corrente.

Guida per le piattaforme

Nota importante per iOS

In iOS 17.4 e versioni successive, il plugin utilizza il client-data di stile browser API quindi l'origine HTTPS configurata viene riflessa in clientDataJSON.

Nota importante per Android

Il Manager delle credenziali Android può condividere lo stesso partito di fiducia e le chiavi passkey del tuo sito web quando sono configurate le Digital Asset Links, ma l'origine di affermazione nativa non è identica a un'origine del browser. Se il tuo backend verifica rigorosamente clientDataJSON.originassicurati che accetti l'origine dell'app Android accanto all'origine del tuo sito web.

Riferimento completo

GitHub: https://github.com/Cap-go/capacitor-passkey/
Documentazione: /docs/plugins/passkey/

Keep going from Using @capgo/capacitor-passkey

@__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-passkey Utilizzando @capgo/capacitor-passkey per pianificare l'autenticazione e le flussi di account, connettilo con @capgo/capacitor-passkey per i dettagli di implementazione in @capgo/capacitor-passkey, Avvio rapido per i dettagli di implementazione in Avvio rapido, @capgo/capacitor-social-login per i dettagli di implementazione in @capgo/capacitor-social-login, @capgo/capacitor-native-biometric per i dettagli di implementazione in @capgo/capacitor-native-biometric, e Autenticazione a due fattori per i dettagli di implementazione in Autenticazione a due fattori.

Passkey

Tutoriale su Passkey