Getting Started

Installazione

Puoi utilizzare la nostra configurazione assistita dall'IA per installare il plugin. Aggiungi le Capgo competenze al tuo strumento di AI utilizzando il seguente comando:

npx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins

Poi utilizza il seguente prompt:

Use the `capacitor-plugins` skill from `Cap-go/capgo-skills` to install the `@capgo/capacitor-recaptcha` plugin in my project.

Se preferisci l'installazione manuale, installa il plugin eseguendo i seguenti comandi e segui le istruzioni specifiche del tuo sistema operativo di seguito:

npm install @capgo/capacitor-recaptcha
npx cap sync

Avvio rapido

Configura le chiavi del sito in capacitor.config.ts in primo luogo, esegui un'azione e verifica il token sul tuo backend.

import { Recaptcha } from '@capgo/capacitor-recaptcha';

const { token } = await Recaptcha.execute({ action: 'login' });
await verifyOnServer(token, 'login');

Difficoltà comuni

• Verifica del serverI token sono a breve durata, verificare con Google prima di fidarsi dei clienti.
• Chiavi: impostare le chiavi per piattaforma nel config.
• Bandiera aziendale: deve corrispondere al tipo di chiave in Google Cloud.

Configura le chiavi del sito

Crea le chiavi per piattaforma in Google Cloud reCAPTCHA, quindi aggiungile a capacitor.config.ts.

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

const config: CapacitorConfig = {
  appId: 'com.example.app',
  appName: 'Example',
  webDir: 'dist',
  plugins: {
    Recaptcha: {
      androidSiteKey: 'ANDROID_SITE_KEY',
      iosSiteKey: 'IOS_SITE_KEY',
      webSiteKey: 'WEB_SITE_KEY',
      enterprise: true,
    },
  },
};

export default config;

androidSiteKey, iosSiteKeye webSiteKey sovrascrivi le chiavi condivise siteKey. Puoi anche passare una siteKey direttamente a load() o execute() quando la chiave dipende dal tuo ambiente.

Genera Un Token

import { Recaptcha } from '@capgo/capacitor-recaptcha';

const { token } = await Recaptcha.execute({
  action: 'login',
});

await fetch('/api/recaptcha-assessment', {
  method: 'POST',
  headers: { 'content-type': 'application/json' },
  body: JSON.stringify({ token, action: 'login' }),
});

execute() chiamate load() si attiva automaticamente quando il client non è pronto, quindi un passaggio di precarico esplicito è facoltativo.

reCAPTCHA Web Standard v3

impostare enterprise: false per caricare lo script standard di reCAPTCHA Web di Google.

const { token } = await Recaptcha.execute({
  siteKey: 'WEB_V3_SITE_KEY',
  enterprise: false,
  action: 'signup',
});

On Android and iOS, Google’s native mobile SDK path is Enterprise/mobile only. Passing enterprise: false è rifiutato su piattaforme native, quindi non viene utilizzato accidentalmente una chiave Web v3 standard.

Note di migrazione

Il plugin accetta gli alias delle vecchie opzioni Cordova sitekeyAndroid e sitekeyWeb in opzioni di chiamata e Capacitor configurazione. Accetta anche sitekeyIos e sitekeyIOS preferite i nomi di configurazione Capacitor per le nuove code come alias di migrazione per iOS.

Keep going from Getting Started

Se stai utilizzando Avvio rapido per pianificare l'autenticazione e le flussi di account, connettilo con Utilizzo di @capgo/capacitor-recaptcha per la capacità nativa in Utilizzo di @capgo/capacitor-recaptcha @capgo/capacitor-login con reCAPTCHA per il dettaglio di implementazione in @capgo/capacitor-social-login @capgo/capacitor-chiave di accesso per il dettaglio di implementazione in @capgo/capacitor-passkey @capgo/capacitor-nativo-biometrico per il dettaglio di implementazione in @capgo/capacitor-native-biometric, e Autenticazione a due fattori per il dettaglio di implementazione in Autenticazione a due fattori