https://github.com/edde746/svelte-captcha-enhance

Easily add captchas to SvelteKit forms
https://github.com/edde746/svelte-captcha-enhance

captcha forms hcaptcha recaptcha sveltekit turnstile

Last synced: 3 months ago
JSON representation

Easily add captchas to SvelteKit forms

• Host: GitHub
• URL: https://github.com/edde746/svelte-captcha-enhance
• Owner: edde746
• License: gpl-3.0
• Created: 2023-07-06T13:34:10.000Z (over 1 year ago)
• Default Branch: master
• Last Pushed: 2024-04-25T17:46:04.000Z (9 months ago)
• Last Synced: 2024-04-26T09:54:42.304Z (9 months ago)
• Topics: captcha, forms, hcaptcha, recaptcha, sveltekit, turnstile
• Language: TypeScript
• Homepage: https://svelte-captcha-enhance.pages.dev
• Size: 81.1 KB
• Stars: 5
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# svelte-captcha-enhance

A lightweight SvelteKit utility to easily add a captcha to your forms with progressive enhancement. Currently reCaptcha, hCaptcha and turnstile are supported.

## Installation

Use npm to install the `svelte-captcha-enhance` package:

```bash

npm install svelte-captcha-enhance

```

## Example

Below is an example of how to use `svelte-captcha-enhance` in your SvelteKit application:

```svelte

  import { env } from '$env/dynamic/public';

  import enhance from 'svelte-captcha-enhance';

  

      ({ result }) => {

        alert(result.data.message);

      }

  }}

>

  

  Submit

```

Check [src/routes](https://github.com/edde746/svelte-captcha-enhance/tree/master/src/routes) for full examples of hCaptcha & Turnstile.

## Usage

You'll need to get your `sitekey` from the desired captcha provider and include it in your environment variables (`PUBLIC_SITEKEY` in the example).

The `callback` function is the same as what would usually be passed to the `enhance` function ([documentation](https://kit.svelte.dev/docs/form-actions#progressive-enhancement)).