next-turnstile

A comprehensive Next.js component for Cloudflare Turnstile with built-in server-side validation and sandbox mode.

Features

• 🚀 Easy to use component for Next.js
• 🔒 Built-in server-side token validation
• 🎨 Fully customizable appearance
• 🧪 Automatic sandbox mode for development
• 📱 Responsive and accessible
• 💪 Written in TypeScript
• ⚡ Zero dependencies

Installation

npm install next-turnstile
# or
yarn add next-turnstile
# or
pnpm add next-turnstile

Usage

Client Component

import { Turnstile } from "next-turnstile";

function MyForm() {
  const handleSuccess = (token: string) => {
    // Handle successful token generation
  };

  return (
    <Turnstile siteKey="your-site-key" theme="dark" onSuccess={handleSuccess} />
  );
}

Server-Side Validation

import { verifyTurnstile } from "next-turnstile";

// In your API route or server action
async function validateToken(token: string) {
  const isValid = await verifyTurnstile(token, {
    secretKey: process.env.TURNSTILE_SECRET_KEY,
    sandbox: process.env.NODE_ENV === "development",
  });
  return isValid;
}

Configuration

[Add detailed configuration options here]

License

MIT © Jed Patterson