Anfangen

Kopieren Sie eine Einrichtungsvorlage mit den Installationsanweisungen und der vollständigen Markdown-Guideline für diesen Plugin.

        Set up this Capacitor plugin in the project.

Use the package manager already used by the project.
Install these package(s): `@capgo/capacitor-recaptcha`
Run the required Capacitor sync/update step after installation.
Read this markdown guide for the full setup steps: https://raw.githubusercontent.com/Cap-go/website/refs/heads/main/apps/docs/src/content/docs/docs/plugins/recaptcha/getting-started.mdx
Use that guide for platform-specific steps, native file edits, permissions, config changes, imports, and usage setup.
If that guide references other docs pages, read them too.

Installieren

npm install @capgo/capacitor-recaptcha
npx cap sync

Site-Schlüssel konfigurieren

Plattformschlüssel in Google Cloud reCAPTCHA erstellen und dann hinzufügen 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, iosSiteKey, und webSiteKey überschreiben Sie die gemeinsam genutzte siteKey. Sie können auch einen Wert direkt übergeben siteKey direkt an load() oder execute() wenn die Schlüssel von Ihrer Umgebung abhängen.

Token generieren

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() aufrufen load() automatisch, wenn der Client nicht bereit ist, daher ist ein expliziter Vorkompilierungsschritt optional.

Web-Standard reCAPTCHA v3

Setzen enterprise: false Google’s Standard-Web-reCAPTCHA-v3-Skript laden.

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

Bei Android und iOS ist der native mobile SDK Pfad nur für Enterprise/mobile verfügbar. Die Weitergabe enterprise: false auf nativen Plattformen wird abgelehnt, daher wird ein Standard-Web-v3-Schlüssel versehentlich nicht verwendet.

Migrationshinweise

Das Plugin akzeptiert die alten Cordova-Option-Alternativen sitekeyAndroid und sitekeyWeb in Aufrufoptionen und Capacitor-Konfiguration. Es akzeptiert auch sitekeyIos und sitekeyIOS als iOS-Migrations-Alternativen. Wählen Sie die Capacitor-Konfigurationsnamen für neue code.

Weitermachen von Getting Started

Wenn Sie " Getting Started für die Planung der Authentifizierung und der Kontoflows verwenden, verbinden Sie es mit Mit @capgo/capacitor-recaptcha für die native Fähigkeit in Mit @capgo/capacitor-recaptcha, für die Implementierungsdetails in @capgo/capacitor-social-login, für die Implementierungsdetails in @capgo/capacitor-passkey, für die Implementierungsdetails in @capgo/capacitor-passkey, für die Implementierungsdetails in @capgo/capacitor-passkey, @capgo/capacitor-native-biometrische für die Implementierungsdetails in @capgo/capacitor-native-biometrische, und Zwei-Faktor-Authentifizierung für die Implementierungsdetails in Zwei-Faktor-Authentifizierung.