본문으로 바로가기
@capgo/capacitor-recaptcha 보안 & 인증 오픈 소스

reCAPTCHA Capacitor 플러그인

Web reCAPTCHA 또는 reCAPTCHA Enterprise 토큰을 생성하고 native Enterprise 모바일 토큰을 생성합니다.

설치

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

설명서

Capacitor에서 reCAPTCHA 사용하는 방법

장치에서 테스트

Capgo 앱을 다운로드한 후 QR code을 스캔하세요

reCAPTCHA 플러그인 미리보기 QR code

@capgo/capacitor-recaptcha 사용

웹, 안드로이드 및 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 웹 구현이 표준 reCAPTCHA v3 대신 reCAPTCHA Enterprise를 로드해야 하는 경우에만 사용하십시오. 안드로이드 및 iOS는 Google의 Enterprise/모바일 SDK 경로를 사용하고 SDK을 거부합니다. enterprise: false.

토큰 생성

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

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

백엔드에 토큰을 보내고 reCAPTCHA 평가를 생성하여 보호된 요청을 수락하기 전에 __CAPGO_KEEP_0__합니다.

전체 참조

Using @capgo/capacitor-recaptcha

이미 @__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-recaptcha를 사용하고 있다면 @capgo/capacitor-recaptcha와 연결하세요. 인증 및 계정 흐름을 계획하고 구현하는 데 @__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-recaptcha를 사용하는 경우 @capgo/capacitor-recaptcha for the implementation detail in @capgo/capacitor-recaptcha, Getting Started __CAPGO_KEEP_0__/__CAPGO_KEEP_1__-recaptcha의 구현 세부 정보 @capgo/capacitor-social-login Capacitor-capgo/capacitor-social-login @capgo/capacitor-passkey Capacitor-capgo/capacitor-passkey, @capgo/capacitor-native-biometric Capacitor-capgo/capacitor-native-biometric.

FAQ

reCAPTCHA 플러그인 FAQ

Capacitor reCAPTCHA 플러그인을 Capacitor 앱에 설치하는 방법은?

Run "bun add @capgo/capacitor-recaptcha" (or "npm install @capgo/capacitor-recaptcha"), then run "bunx cap sync" so the iOS and Android projects pick up the native code. Import it from "@capgo/capacitor-recaptcha" in your app code.

Does @capgo/capacitor-recaptcha work with React, Vue and Angular?

Yes. reCAPTCHA is a Capacitor package, so it works with any web framework that runs inside Capacitor, including Ionic, React, Vue, Angular, Svelte and plain JavaScript.

Capacitor-recaptcha Capacitor 버전은 @capgo/capacitor-recaptcha이 지원하는 버전인가?

Capgo plugins follow Capacitor's major version: use the plugin major version that matches your Capacitor major version (for example plugin v8 with Capacitor 8). The compatibility table in the GitHub README lists the maintained versions.

capgo/capacitor-recaptcha는 무료이며 오픈 소스인가요?

Yes. The source code is public on GitHub at https://github.com/Cap-go/capacitor-recaptcha/ and the package is free to install from npm. Bug reports and pull requests are welcome.

애플 스토어 리뷰 없이 reCAPTCHA를 사용하는 code를 업데이트할 수 있나요?

Installing or upgrading the plugin changes native code, so it needs a new store build. After that, JavaScript, HTML and CSS changes that call the plugin can ship instantly with Capgo live updates.

앱 리뷰 대기 없이 reCAPTCHA 변경을 배포하세요.

플러그인이 스토어 빌드에 포함된 후, Capgo 라이브 업데이트는 사용자에게 몇 분만에 자바스크립트, HTML 및 CSS 변경을 푸시합니다.

Capgo 시작