Einstieg

Eine Einrichtungsanweisung mit den Installationsanweisungen und der vollständigen Markdown-Guideline für diesen Plugin kopieren.

        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, dann hinzufügen zu 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 die gemeinsamen siteKey. Sie können auch einen siteKey direkt an load() oder execute() wenn der Schlüssel von Ihrer Umgebung abhängt.

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() wird automatisch ausgeführt, wenn der Client noch nicht bereit ist, daher ist ein expliziter Vorkompilierungsschritt optional.

Web-Standard reCAPTCHA v3

Setzen enterprise: false um Googles Standard-Web-reCAPTCHA v3-Skript zu laden.

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

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

Migration Notes

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

Weitermachen von Getting Started

Wenn Sie Getting Started zur Planung von Authentifizierung und Kontoflüssen verwenden, verbinden Sie es mit Mit @capgo/capacitor-recaptcha für die native Fähigkeit in Mit @capgo/capacitor-recaptcha, @capgo/capacitor-social-login für die Implementierungsdetails in @capgo/capacitor-social-login, @capgo/capacitor-passkey für die Implementierungsdetails in @capgo/capacitor-passkey, @capgo/capacitor-native-biometric für die Implementierungsdetails in @capgo/capacitor-native-biometric, und Zwei-Faktor-Authentifizierung für die Implementierungsdetails in Zwei-Faktor-Authentifizierung.