@ captchafox/ 反应

安装

使用您喜欢的软件包管理器安装库

npm install @captchafox/react

yarn add @captchafox/react

pnpm add @captchafox/react

bun add @captchafox/react

使用量

import { CaptchaFox } from '@captchafox/react';

function Example() {
  return <CaptchaFox sitekey="sk_11111111000000001111111100000000" />;
}

道具

使用验证回调

import { CaptchaFox, CAPTCHA_RESPONSE_KEY } from '@captchafox/react';

function Example() {
  const handleVerify = (token: string) => {
    // do something with the token here (e.g. submit the form)
    const formData = {
      // your form data
      [CAPTCHA_RESPONSE_KEY]: token
    };
  };

  return <CaptchaFox sitekey="sk_11111111000000001111111100000000" onVerify={handleVerify} />;
}

与实例互动

import { useRef } from 'react'
import { CaptchaFox, CaptchaFoxInstance } from '@captchafox/react'

function Example() {
    const captchaRef = useRef<CaptchaFoxInstance | null>(null);

    const triggerAction = async () => {
        // execute the captcha
        try {
            const token = await captchaRef.current?.execute()
        } catch {
            // unsuccessful verification
        }
    }

    return (
        <CaptchaFox
            sitekey="sk_11111111000000001111111100000000"
            ref={captchaRef}
        />
        <button onClick={triggerAction}>Action</button>
    )
}

您可以在 GitHub 仓库。 。 。 .