メインコンテンツにスキップ
プラグインに戻る
@capgo/capacitor-recaptcha
チュートリアル
@capgo/capacitor-recaptcha

reCAPTCHA

Web reCAPTCHA と reCAPTCHA Enterprise のトークンを生成するプラスネイティブ エンタープライズ モバイル トークン

ガイド

reCAPTCHAのチュートリアル

デバイスでテスト

Capgoアプリをダウンロードし、QRコードのcodeをスキャンしてください。

reCAPTCHA プラグインのプレビュー QR code

@capgo/capacitor-recaptchaを使用

Web、Android、iOS CapacitorアプリからreCAPTCHAとreCAPTCHA Enterpriseのトークンを生成

インストール

npm install @capgo/capacitor-recaptcha
npx cap sync

設定

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

const config: CapacitorConfig = {
  plugins: {
    Recaptcha: {
      androidSiteKey: 'ANDROID_SITE_KEY',
      iosSiteKey: 'IOS_SITE_KEY',
      webSiteKey: 'WEB_SITE_KEY',
      enterprise: true,
    },
  },
};

export default config;

使用 enterprise: false SDKのWeb実装では、reCAPTCHA Enterpriseの代わりに標準のreCAPTCHA v3をロードする場合にのみ使用してください。 AndroidとiOSはGoogleのEnterprise/Mobile SDKパスを使用し、拒否します。 enterprise: false.

トークンを生成

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

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

保護されたリクエストを受け入れる前に、バックエンドにトークンを送信し、reCAPTCHAの評価を実行してください。

フルリファレンス

capgo/capacitor-recaptchaを使用している場合に続けてください

Capacitor reCAPTCHAプラグインを使用している場合に続けてください @capgo/capacitor-recaptcha を使用して認証とアカウントフローの計画、@__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-recaptcha @capgo/capacitor-recaptcha @capgo/capacitor-recaptcha の実装詳細は@__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-recaptcha のドキュメントを参照してください。 @capgo/capacitor-social-login for the implementation detail in @capgo/capacitor-social-login, @capgo/capacitor-passkey @capgo/capacitor-social-login の実装詳細は@capgo/capacitor-social-login のドキュメントを参照してください。、@capgo/capacitor-passkey、@capgo/capacitor-passkey、@capgo/capacitor-native-biometric、@capgo/capacitor-native-biometric.