react-turnstile icon indicating copy to clipboard operation
react-turnstile copied to clipboard

Undefined tokens

Open shermanaN opened this issue 6 months ago • 1 comments

I'm using your react-turnstile library in a ReactJS frontend to generate tokens. Here is a snippet code showing how we are using it.

`// posting.js const PostingApp = ({postingProps}) => { const turnstileRef = useRef(null); const [turnstileTkn, setTurnstileTkn] = useState(null); return ( <WidgetTurnstile turnstileResponse={(tkn) => setTurnstileTkn({ref: turnstileRef, tkn: tkn})} turnstileRef={turnstileRef} siteKeyCustom={ 'xxxxxxx'} /> ); };

export default PostingApp;

// turnstile.js import React from "react"; import { Turnstile } from '@marsidev/react-turnstile';

interface TurnstileProps { turnstileResponse: (token: string) => void, siteKeyCustom?: string, turnstileRef: any, hidden?: boolean }

const TurnstileWidget = ({turnstileResponse, siteKeyCustom, turnstileRef, hidden = true}: TurnstileProps) => { const siteKey = 'xxxxxxxxxxxxxx'; return ( <Turnstile siteKey={siteKeyCustom || siteKey} onSuccess={turnstileResponse} onExpire={() => turnstileResponse('expired')} onError={(e: any) => turnstileResponse(e)} ref={turnstileRef} style={{ display: hidden ? 'none' : 'block' }} /> ); }; ` We put the code in production and we were logging the tokens we obtained from the turnstile widget. Analyzing those logs we noticed that 60% approx of the logged tokens were ‘undefined’. We would like to know if we are doing something wrong in our implementation or if it’s a known behavior of your library.

Could you please take a look and let me know if there's anything we're doing incorrectly? Is there any recommendation to use the widget using your library?

shermanaN avatar Aug 15 '24 21:08 shermanaN