diff --git a/README.md b/README.md index 89dbf3e..e245cc8 100644 --- a/README.md +++ b/README.md @@ -20,7 +20,7 @@ The only required prop is the `siteKey` which you can get from [adding a site he ```svelte @@ -71,36 +71,36 @@ If you are using a HTML Form and POSTing to a server you can get the `cf-turnsti ```ts interface TokenValidateResponse { - 'error-codes': string[]; - success: boolean; - action: string; - cdata: string; + 'error-codes': string[]; + success: boolean; + action: string; + cdata: string; } async function validateToken(token: string, secret: string) { - const response = await fetch( - 'https://challenges.cloudflare.com/turnstile/v0/siteverify', - { - method: 'POST', - headers: { - 'content-type': 'application/json', - }, - body: JSON.stringify({ - response: token, - secret: secret, - }), - }, - ); - - const data: TokenValidateResponse = await response.json(); - - return { - // Return the status - success: data.success, - - // Return the first error if it exists - error: data['error-codes']?.length ? data['error-codes'][0] : null, - }; + const response = await fetch( + 'https://challenges.cloudflare.com/turnstile/v0/siteverify', + { + method: 'POST', + headers: { + 'content-type': 'application/json', + }, + body: JSON.stringify({ + response: token, + secret: secret, + }), + }, + ); + + const data: TokenValidateResponse = await response.json(); + + return { + // Return the status + success: data.success, + + // Return the first error if it exists + error: data['error-codes']?.length ? data['error-codes'][0] : null, + }; } ``` @@ -112,17 +112,17 @@ In SvelteKit we can use form actions to easily setup a form with a captcha: ```svelte {#if form?.error} -

{form?.error}

+

{form?.error}

{/if}
- + ``` @@ -132,21 +132,21 @@ In SvelteKit we can use form actions to easily setup a form with a captcha: // Copy and paste the validateToken function from above here export const actions = { - default: async ({ request }) => { - const data = await request.formData(); + default: async ({ request }) => { + const data = await request.formData(); - const token = data.get('cf-turnstile-response'); // if you edited the formsField option change this - const SECRET_KEY = '...'; // you should use $env module for secrets + const token = data.get('cf-turnstile-response'); // if you edited the formsField option change this + const SECRET_KEY = '...'; // you should use $env module for secrets - const { success, error } = await validateToken(token, SECRET_KEY); + const { success, error } = await validateToken(token, SECRET_KEY); - if (!success) - return { - error: error || 'Invalid CAPTCHA', - }; + if (!success) + return { + error: error || 'Invalid CAPTCHA', + }; - // do something, the captcha is valid! - }, + // do something, the captcha is valid! + }, }; ``` @@ -156,12 +156,10 @@ If you need to manually reset the widget, you can do so by binding to the `reset ```svelte - + ```