Passkey plugin de Capacitor

Usando @capgo/capacitor-passkey

Mantén tu estilo de navegador WebAuthn code en una aplicación Capacitor mientras el complemento gestiona llamadas de passkey nativas y parches de host nativos.

Estilo de navegador API

@capgo/capacitor-passkey Mantén el mismo flujo de WebAuthn que ya usas en la web:

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

En compilaciones nativas, el complemento instala un shim para navigator.credentials.create() y navigator.credentials.get()envía la solicitud a las APIs de passkey de iOS y Android, y devuelve objetos de credenciales como en un navegador a tu aplicación.

Instale y sincronice proyectos nativos

bun add @capgo/capacitor-passkey
bunx cap sync

Configure la aplicación de host una vez

Agregue la configuración del plugin en 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;

¿Qué hace la configuración del plugin?

La configuración se lee desde plugins.CapacitorPasskey en capacitor.config.*.

• origin: origen HTTPS principal de confianza utilizado por el shim y directo API
• domains: agregar hostnames de terceros para parchear en la configuración nativa durante la sincronización
• autoShim: predeterminado true y controla la configuración nativa cap sync la función de configuración automática

Run sync again after changing the config:

bunx cap sync

Instala el shim durante el arranque

Importa el plugin desde la entrada estándar del paquete, luego instala el shim durante el arranque de la aplicación:

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

await CapacitorPasskey.autoShimWebAuthn();

Después de eso, tu existente code de autenticación de navegador puede permanecer igual.

Si necesitas forzar el shim o sobreescribir el origen configurado en tiempo de ejecución, llama:

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

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

Mantén tu flujo normal de WebAuthn

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

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

¿Qué parches de sincronización te benefician?

Durante bunx cap sync, el plugin actualiza los proyectos de anfitrión nativos generados:

• iOS: permisos de dominio asociados y configuración de permisos de Xcode cuando sea necesario
• Android: asset_statements metadatos y el recurso generado utilizado por el manifiesto

Native setup still needs website trust files

El plugin reduce el trabajo en la aplicación, pero las claves de acceso todavía dependen de los archivos de confianza del sitio web para tu dominio de parte confiable. Todavía necesitas hospedar:

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

El plugin puede parchear los proyectos nativos generados durante la sincronización, pero no puede crear ni alojar esos archivos de confianza del sitio web para ti.

Otros métodos públicos

El plugin público API también expone los ayudantes directos definidos en src/definitions.ts:

• await CapacitorPasskey.getConfiguration() devuelve la resolución origin, domains, autoShim, and current platform.
• await CapacitorPasskey.createCredential(...) registra una clave de acceso a partir de un payload WebAuthn seguro JSON.
• await CapacitorPasskey.getCredential(...) autentica con una clave de acceso existente desde un payload seguro JSON de WebAuthn.
• await CapacitorPasskey.isSupported() indica si el tiempo de ejecución actual admite claves de acceso.
• await CapacitorPasskey.getPluginVersion() devuelve la marca de versión de implementación nativa actual.

Guías de plataforma

• Configuración inicial
• iOS setup
• Configuración para Android
• Nota del backend

Nota importante de iOS

En iOS 17.4 y posteriores, el complemento utiliza el cliente de datos estilo navegador API por lo que el origen HTTPS configurado se refleja en clientDataJSON.

Advertencia importante de Android

El administrador de credenciales de Android puede compartir la misma parte interesada y claves de acceso como su sitio web cuando se configuran los enlaces de activos digitales, pero el origen de la afirmación nativa no es idéntico a un origen de navegador. Si su backend valida estrictamente clientDataJSON.originAsegúrese de que acepte el origen de la aplicación Android junto con el origen de su sitio web.

Referencia completa

• GitHub: https://github.com/Cap-go/capacitor-passkey/
• Documentación: /es/docs/plugins/passkey/

Sigue adelante desde el uso de @capgo/capacitor-passkey

Si estás utilizando Usando @capgo/capacitor-passkey para planificar la autenticación y los flujos de cuenta, conecta con @capgo/capacitor-passkey para el detalle de implementación en @capgo/capacitor-passkey Iniciar sesión para el detalle de implementación en Iniciar sesión @capgo/capacitor-login-social para el detalle de implementación en @capgo/capacitor-social-login @capgo/capacitor-nativo-biomet́rico para el detalle de implementación en @capgo/capacitor-nativo-biometria, y Autenticación de dos factores para el detalle de implementación en Autenticación de dos factores.