Skip to content

Svelte Integration

Procaptcha provides an official Svelte component for easy integration of Prosopo Procaptcha into any Svelte project. The integration component supports all the Procaptcha render options.

1. Installation

npm install @prosopo/svelte-procaptcha-wrapper

2. Example of usage

2.1) Basic setup

<script lang="ts">
import {ProcaptchaComponent} from "@prosopo/svelte-procaptcha-wrapper";
</script>

<ProcaptchaComponent siteKey={"my-site-key"}/>;

2.2) Advanced usage

<script lang="ts">
import {ProcaptchaComponent} from "@prosopo/svelte-procaptcha-wrapper";

const siteKey = "my-site-key";
const handleVerification = (token: string): void => {
    console.log('verified', token);
};
</script>

<ProcaptchaComponent siteKey="{siteKey}"
language="en"
callback={handleVerification}
htmlAttributes={{class: "my-app__procaptcha"}} />