How to Find Leaked API Keys in Your JavaScript Bundle

Check the deployed site, not your local dev server — the live bundle is what attackers see.

• Right-click anywhere → Inspect (or F12 / Cmd+Option+I).
• Go to the Sources tab (Chrome/Edge) or Debugger (Firefox).
• Press Ctrl+Shift+F (Cmd+Option+F on Mac) to search across every loaded file.
• Also peek at the Network tab: reload, filter by JS or Fetch/XHR, and look at request headers — a key sent as Authorization: Bearer sk-… from the browser is a leak too.

Click around a bit first (log in, open a few pages) so lazy-loaded chunks get loaded and searched.

Bonus searches: service_role (catches code or variable names that mention it), secret, api_key and Bearer. Expect some false positives from library code — what you care about is a long, random-looking string sitting right next to the match.

Finding a key isn't automatically bad. Some keys are meant to live in the browser:

Found a service_role key? We wrote a whole guide: Supabase service_role key exposed? Don't panic, do this →

If a secret was ever in a public bundle, assume someone has it — deleting it from the code doesn't un-leak it. Old deploys, CDN caches and git history stick around.

• Create a new key in the provider's dashboard (OpenAI, Anthropic, Stripe, AWS IAM, Supabase).
• Revoke or delete the old one. (Exception: a legacy Supabase service_role JWT can't be revoked on its own; see the Supabase guide below.)
• Check the provider's usage/billing and logs for activity you don't recognize.

Put the new key in a server-only env var on your host. No NEXT_PUBLIC_, VITE_, REACT_APP_ or PUBLIC_ prefix — those literally mean "bundle this for the browser." Only read it from server code: API routes, server actions, edge functions.

Your frontend still needs the feature, so give it a tiny server route that makes the call on its behalf. The browser talks to your endpoint; only your server talks to the provider.

// app/api/chat/route.ts (Next.js sketch)
export async function POST(req: Request) {
  // 1. check the user is logged in (and rate-limit them)
  const { prompt } = await req.json();

  const res = await fetch("https://api.openai.com/v1/chat/completions", {
    method: "POST",
    headers: {
      Authorization: `Bearer ${process.env.OPENAI_API_KEY}`, // server-only
      "Content-Type": "application/json",
    },
    body: JSON.stringify({
      model: "your-model",
      messages: [{ role: "user", content: prompt }],
    }),
  });

  return new Response(res.body, { status: res.status });
}

Add auth and a rate limit so your proxy doesn't become a free, public relay for someone else. On Supabase, an Edge Function with the key stored as a function secret does the same job.