Stripe Integration Demo

This page demonstrates the Nuxt Stripe integration with server-side configuration.

Payment Form

⚠️ Setup Required

Before the payment form works, you need to:

  1. Add your Stripe keys to .env file
  2. Start Stripe CLI listener: stripe listen --forward-to localhost:3001/api/stripe/webhook
  3. Add the webhook secret to .env
Required .env variables:
STRIPE_SECRET_KEY=sk_test_...
STRIPE_PUBLIC_KEY=pk_test_...
STRIPE_WEBHOOK_SECRET=whsec_...

Payment Form

Server Configuration Status

Stripe Module: @unlok-co/nuxt-stripe

Server Config: Configured in nuxt.config.ts

API Routes: Available at /api/stripe/*

Server Composable: useServerStripe(event)

Client Composable: useClientStripe()

Test Server Connection

Sync Subscription

Sync your subscription status from Stripe. This will search for your customer by email and update your subscription level.