1.1.3 • Published 4 months ago
react-geetest-v4 v1.1.3
GeeTest integration for React
A very simple React component to integrate GeeTest captcha.
Installation
npm install react-geetest-v4
Usage
Normal practice
import React from 'react';
import GeeTest, { GeeTestRef } from 'react-geetest-v4';
export default function Home(): JSX.Element {
const captchaRef = React.useRef<GeeTestRef | null>(null); // Access: showCaptcha, reset, ...
return (
<div>
<GeeTest
captchaId={'your captcha id'}
containerId={'geetest-captcha'} // Optional
onSuccess={(result) => console.log('success. result: ', result)}
onReady={() => console.log('ready')}
/>
<br />
<GeeTest
ref={captchaRef}
captchaId={'your captcha id'}
product={'bind'}
onSuccess={() => console.log('success')}
>
<button>Submit</button>
</GeeTest>
</div>
);
}
Using hooks
import React from 'react';
import { useGeeTest } from 'react-geetest-v4';
export default function Home(): JSX.Element {
const { captcha, state } = useGeeTest('your captcha id', {
product: 'bind',
protocol: 'https://',
containerId: 'geetest-captcha',
});
const onClick = () => {
captcha?.showCaptcha();
};
return (
<div>
<button onClick={onClick}>Submit</button>
</div>
);
}
Server validation
On this example we're using Next.JS handlers, but you can use any other framework.
import type { NextApiRequest, NextApiResponse } from 'next';
import { validateCaptcha, generateSignToken } from 'react-geetest-v4';
const CAPTCHA_ID = '647f5ed2ed8acb4be36784e01556bb71';
const CAPTCHA_KEY = 'b09a7aafbfd83f73b35a9b530d0337bf';
export default async function handler(req: NextApiRequest, res: NextApiResponse) {
const { captcha_output, gen_time, lot_number, pass_token } = req.body;
if (!captcha_output || !gen_time || !lot_number || !pass_token) {
return res.status(400).json({ error: 'Missing required parameters' });
}
const { result } = await validateCaptcha({
captcha_id: CAPTCHA_ID,
lot_number,
captcha_output,
pass_token,
gen_time,
sign_token: generateSignToken(lot_number, CAPTCHA_KEY),
});
return res.status(200).json({ ok: result === 'success' });
}
1.1.3
4 months ago
1.1.2
5 months ago
1.1.1
11 months ago
1.1.0-patch.1
11 months ago
1.1.0-patch.2
11 months ago
1.1.0-patch.3
11 months ago
1.1.0
1 year ago
1.0.9-alpha.3
1 year ago
1.0.9-alpha.2
1 year ago
1.0.9-alpha.1
1 year ago
1.0.8
1 year ago
1.0.7
1 year ago
1.0.6-alpha.14
1 year ago
1.0.6-alpha.13
1 year ago
1.0.6-alpha.12
1 year ago
1.0.6-alpha.11
1 year ago
1.0.6-alpha.10
1 year ago
1.0.6-alpha.9
1 year ago
1.0.6-alpha.8
1 year ago
1.0.6-alpha.7
1 year ago
1.0.6-alpha.6
1 year ago
1.0.6-alpha.5
1 year ago
1.0.6-alpha.4
1 year ago
1.0.6-alpha.3
1 year ago
1.0.6-alpha.1
1 year ago
1.0.5
1 year ago
1.0.4
1 year ago
1.0.3
1 year ago
1.0.2
1 year ago
1.0.1
1 year ago
1.0.0
1 year ago