Back to guides

Guide · Security

Why API Keys Should Not Be in Frontend

Putting API keys in JavaScript or mobile apps is one of the most common—and costly—security mistakes. Here's why and what to do instead.

APRF requires keys to stay server-side with auditable storage and rotation. Primary control: Secrets Management

The client is a hostile environment

Anything shipped to a browser or mobile binary can be extracted—View Source, DevTools, or unpacking an IPA. Bots scrape provider keys within hours of a public deploy. Obfuscation and minification are not encryption. That is why APRF Secrets Management forbids long-lived credentials in clients.

A React chat feature once bundled an OpenAI secret. A researcher found it in minutes; before rotation finished, automated use had already burned a large API bill.

Publishable vs secret

Some vendors intentionally ship publishable keys (e.g. Stripe) with tight scopes. Those are designed for the client. Secret keys for OpenAI, AWS, Anthropic, payment capture, and admin APIs are not. If the browser needs the capability, your backend holds the secret and proxies.

App  →  your API (auth + quotas)  →  secrets store + provider

Fix once, rotate always

Move calls server-side, store replacements in Secrets Manager (or server-only env), use separate keys for environments, and treat any key that ever touched a client as compromised—rotate it. Pair with spend alerts so the next scrape cannot run quietly until the invoice.

Next: Secrets Management

Open the related pillar specification for mandatory checks, artifacts, and pass conditions. Self-attest is optional.

Frequently asked questions

Can you hide an API key in frontend code?
No. Any key in client-side JavaScript, HTML, or mobile app bundles can be extracted. Obfuscation and minification do not provide security. Always use a backend to hold and use API keys.
What happens if my API key is in the frontend?
The key is exposed to anyone who inspects your app. Bots scrape exposed keys and use them for abuse, data extraction, or cost amplification. Rotate the key immediately and move all API calls to a backend.
Where should API keys be stored?
Store API keys in a secrets manager (AWS Secrets Manager, HashiCorp Vault) or server-side environment variables. Never in frontend code, git repositories, or client-accessible config.