Utilizza @capgo/capacitor-passkey

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

Browser-style API

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

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

Sui costrutti nativi, il plugin installa un shim per navigator.credentials.create() e navigator.credentials.get()Avvia la richiesta alle API passkey iOS e Android, e restituisce oggetti di credenziali browser-like al tuo app.

Installare e sincronizzare progetti nativi

bun add @capgo/capacitor-passkey
bunx cap sync

Configura l'app host una volta sola

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 primaria utilizzata dal shim e diretto API
domains: hostnames di origine aggiuntivi da patchare nella configurazione nativa durante la sincronizzazione
autoShim: predefinito true e controlla la configurazione nativa cap sync hook di configurazione automatica

Esegui nuovamente la sincronizzazione dopo aver modificato la configurazione:

bunx cap sync

Installare il shim durante l'avvio

Importare il plugin dall'ingresso standard del pacchetto, quindi installare il shim durante l'avvio dell'applicazione:

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

await CapacitorPasskey.autoShimWebAuthn();

Dopo di che, il tuo esistente passkey di stile browser code può rimanere lo stesso.

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

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

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

Mantieni il tuo flusso WebAuthn normale

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

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

Cosa le patch di sincronizzazione per te

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

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

La configurazione nativa richiede ancora i file di fiducia del sito web

Il plugin riduce il lavoro sul lato dell'applicazione, ma le chiavi passive ancora dipendono dai file di fiducia del sito web per il tuo dominio di partito di riferimento. Ancora devi ospitare:

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

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

Altri metodi pubblici

Il plugin pubblico API esporre anche gli aiutanti diretti definiti in src/definitions.ts:

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

Guida alla piattaforma

Nota importante per iOS

Con iOS 17.4 e versioni successive, il plugin utilizza il client-data di tipo 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/

Continua da Utilizzare @capgo/capacitor-passkey

Se stai utilizzando Utilizzare @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 per i dettagli di implementazione in Avvio, @capgo/capacitor-login-social per i dettagli di implementazione in @capgo/capacitor-login-social @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.

Icona del plugin Passkey

Tutorial sul Passkey