API key visible in the client bundle
API key exposed in client bundleA secret pasted into frontend code ships to every visitor. Anyone can open devtools and read it, and the bill is yours.
Symptom
No error. The app works. The key is readable in the browser's Sources tab or by searching the deployed JS for the key prefix.
Why it happens
Anything a frontend bundle can read, a visitor can read - the bundle is shipped to their machine. AI generators write direct calls to OpenAI or similar from the browser because it is the shortest path to a working demo, and it does work. Prefixing the variable with VITE_ or NEXT_PUBLIC_ to 'fix' the undefined error (see env-vars-not-working-in-production) actively makes this worse: it is the instruction to publish the secret. The exposure is silent and the first symptom is usually the invoice.
Fix
Move the call server-side - a serverless function or API route that holds the key and proxies the request. Rotate the exposed key immediately; it must be assumed compromised. Add rate limiting to the proxy so the endpoint cannot be abused in turn.