Aller au contenu principal
@capgo/capacitor-recaptcha Auth & sécurité Open source

reCAPTCHA Plugin Capacitor

Générez des tokens reCAPTCHA Web ou reCAPTCHA Enterprise, ainsi que des tokens mobiles natifs Enterprise

Installer

bun add @capgo/capacitor-recaptcha bunx cap sync
npm, pnpm ou yarn
  • npm install @capgo/capacitor-recaptcha
  • pnpm add @capgo/capacitor-recaptcha
  • yarn add @capgo/capacitor-recaptcha

Guide

Comment utiliser reCAPTCHA dans Capacitor

Tester sur l'appareil

Téléchargez l'application Capgo, puis scannez le QR code.

QR d'aperçu du plugin reCAPTCHA code

Utiliser @capgo/capacitor-recaptcha

Générez des tokens reCAPTCHA et reCAPTCHA Enterprise depuis vos apps Web, Android et iOS Capacitor.

Installer

npm install @capgo/capacitor-recaptcha
npx cap sync

Configurer

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;

Utiliser enterprise: false uniquement lorsque l’implémentation Web doit charger reCAPTCHA v3 standard au lieu de reCAPTCHA Enterprise. Android et iOS utilisent le parcours Enterprise/mobile de Google SDK et rejettent enterprise: false.

Générer un token

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

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

Envoyez le token à votre backend et créez une évaluation reCAPTCHA avant d’accepter la requête protégée.

Référence complète

Continuez depuis Utilisation de @capgo/capacitor-recaptcha

Si vous utilisez Utiliser @capgo/capacitor-recaptcha pour planifier les flux d'authentification et de compte, le connecter à @capgo/capacitor-recaptcha pour les détails d’implémentation dans @capgo/capacitor-recaptcha, Prise en main pour les détails d'implémentation dans Getting Started @capgo/capacitor-social-login pour les détails d'implémentation dans @capgo/capacitor-social-login @capgo/capacitor-passkey pour les détails d'implémentation dans @capgo/capacitor-passkey, et @capgo/capacitor-native-biometric pour les détails d'implémentation dans @capgo/capacitor-native-biometric.

FAQ

FAQ du plugin reCAPTCHA

Comment installer le plugin reCAPTCHA dans une app Capacitor ?

Exécutez « bun add @capgo/capacitor-recaptcha » (ou « npm install @capgo/capacitor-recaptcha »), puis « bunx cap sync » pour que les projets iOS et Android récupèrent le code natif code. Importez-le depuis « @capgo/capacitor-recaptcha » dans le code de votre app code.

Le plugin @capgo/capacitor-recaptcha fonctionne-t-il avec React, Vue et Angular ?

Oui. reCAPTCHA est un package Capacitor, il fonctionne donc avec n’importe quel framework web exécuté dans Capacitor, y compris Ionic, React, Vue, Angular, Svelte et le JavaScript pur.

Quelle version de Capacitor prend en charge @capgo/capacitor-recaptcha ?

Les plugins Capgo suivent la version majeure de Capacitor : utilisez la version majeure du plugin qui correspond à la version majeure de votre Capacitor (par exemple le plugin v8 avec Capacitor 8). Le tableau de compatibilité du README de GitHub recense les versions maintenues.

Le plugin @capgo/capacitor-recaptcha est-il gratuit et open source ?

Oui. Le code source code est public sur GitHub à l’adresse https://github.com/Cap-go/capacitor-recaptcha/ et le package est gratuit à installer depuis npm. Les signalements de bugs et les pull requests sont les bienvenus.

Puis-je mettre à jour code qui utilise reCAPTCHA sans passer par une revue de l’App Store ?

L'installation ou la mise à jour du plugin modifie le code natif, ce qui impose un nouveau build pour les stores. Ensuite, les changements JavaScript, HTML et CSS qui appellent le plugin peuvent être livrés instantanément via les live updates de Capgo.

Déployez les changements reCAPTCHA sans attendre la validation de l’app

Une fois le plugin intégré à votre build de store, Capgo live updates déploie vos changements JavaScript, HTML et CSS aux utilisateurs en quelques minutes.

Commencez avec Capgo