Fixes › Env vars & leaked keys

OpenAI / Stripe secret key leaked in the browser

LovableBoltv0ReplitCursor

The error

sk-... or sk_live_... visible in DevTools network tab or page source

Why it happens

Calling a paid API directly from React puts the secret key into the JavaScript bundle. Any visitor can copy it and run up your bill. Env vars prefixed VITE_ or NEXT_PUBLIC_ are embedded into client code at build time.

How to fix it

1. Revoke the leaked key in the provider dashboard right now and create a new one.
2. Store the new key in a server-only env var (no VITE_/NEXT_PUBLIC_ prefix).
3. Create a server route (/api/...) or edge function that calls the provider.
4. Have the frontend call your route, and add auth plus rate limiting to it.

Fix prompt (paste into Lovable, Bolt, Cursor, Replit or v0)

My <OpenAI/Stripe> secret key is being used from the frontend. Move every call that uses it into a server-side API route (or Supabase Edge Function), read the key from a server-only env var without a VITE_ or NEXT_PUBLIC_ prefix, make the frontend call that route instead, require a signed-in user, and add basic rate limiting. Then search the codebase and confirm no secret key remains in client code.

FAQ

Does a .env file hide it?

Only for server code. Anything bundled for the browser is public.

Is the Stripe publishable key okay to expose?

Yes. pk_ keys are public; sk_ and rk_ keys are secret.

Related fixes

• Supabase service_role key exposed in frontend code
• Environment variable is undefined in production
• OpenAI 429 'You exceeded your current quota' or a surprise AI bill
• .env file committed to GitHub