Is Your Stripe Secret Key in Your JavaScript Bundle? Here's How to Check

1The Problem: AI Puts Your Secret Key in Client Code

Here's what typically happens. You prompt your AI coding tool:

"Add Stripe checkout to my Next.js app"

The AI generates something like this in a React component:

// ❌ WRONG — this is a CLIENT component
"use client";
import Stripe from "stripe";

const stripe = new Stripe("sk_live_abc123...");

export function CheckoutButton() {
  const handleClick = async () => {
    const session = await stripe.checkout.sessions.create({
      // ...
    });
  };
  return <button onClick={handleClick}>Pay</button>;
}

2What Someone Can Do With Your Stripe Secret Key

• Create charges against any customer in your account
• Read all customer data — emails, addresses, payment methods
• Issue refunds on any transaction
• Create and manage subscriptions
• Access your entire transaction history

This is not a theoretical risk. We've found live sk_live_ keys in 11 out of 100 AI-built apps we scanned.

3How to Check in 30 Seconds

Method 1 — Free Security Scanner (easiest):

1. Go to aiexposuretool.com/security
2. Enter your site URL
3. The scanner downloads your JS bundles and scans for sk_live_ and sk_test_ patterns
4. Get results in 30 seconds — no signup needed

Method 2 — Manual check (DevTools):

1. Open your site in Chrome
2. Open DevTools (F12 or Cmd+Option+I)
3. Go to Sources tab
4. Press Cmd+Shift+F (search across all files)
5. Search for sk_live_ or sk_test_
6. If you see a match — your key is exposed

4The Fix: Move Stripe to Server-Side

// ✅ CORRECT — Server-side API route
// /app/api/checkout/route.ts

import Stripe from "stripe";
import { NextResponse } from "next/server";

const stripe = new Stripe(process.env.STRIPE_SECRET_KEY!);

export async function POST(req: Request) {
  const session = await stripe.checkout.sessions.create({
    mode: "payment",
    line_items: [{ price: "price_xxx", quantity: 1 }],
    success_url: "https://yoursite.com/success",
    cancel_url: "https://yoursite.com/cancel",
  });
  return NextResponse.json({ url: session.url });
}

// ✅ Client component — calls the API route
"use client";

export function CheckoutButton() {
  const handleClick = async () => {
    const res = await fetch("/api/checkout", { method: "POST" });
    const { url } = await res.json();
    window.location.href = url;
  };
  return <button onClick={handleClick}>Pay</button>;
}

The secret key stays in .env.local (server only). The client component only calls the API route — no key exposed.

5Publishable Key vs Secret Key — Quick Reference

Frequently Asked Questions