Expert insights on AI-powered coding security, vibe-based development practices, and protecting AI-generated web applications from vulnerabilities.

· · 2 min read

What Is API Key Exposure?

API keys secrets management security credential leaks
API Key Exposure : A security vulnerability where API keys, tokens, passwords, or other secrets are unintentionally exposed in client-side code, public repositories, logs, error messages, or configuration files. Exposed API keys can be used by attackers to access paid services, exfiltrate data, or impersonate the application.

Why It Matters for AI-Coded Apps

AI coding tools are notorious for hardcoding API keys directly in source files. When prompted to ‘connect to the Stripe API,’ LLMs will often embed the key directly in the code rather than reading from environment variables. 38% of vibe-coded apps in our research exposed at least one API key in client-side bundles.

Real-World Example

AI-generated code includes const stripe = new Stripe('sk_live_abc123...') directly in a React component. This key ships in the JavaScript bundle visible to anyone who opens browser DevTools. Within hours, bots scanning public bundles find the key and start making charges.

How to Detect and Prevent It

Never hardcode secrets in source code. Use environment variables and .env files (add .env to .gitignore). Use server-side API routes to proxy requests that need secret keys. Implement secret scanning in CI/CD (GitGuardian, TruffleHog). Rotate keys immediately if exposed.

Frequently Asked Questions

What should I do if I accidentally committed an API key?

Immediately revoke and rotate the key through the service’s dashboard. Removing it from code doesn’t help – git history preserves it. Use git filter-branch or BFG Repo Cleaner to purge it from history if the repo is public. Assume the key was compromised the moment it was pushed.

What is the difference between public and secret API keys?

Public keys (like Stripe’s pk_live_) are designed to be used in client-side code and have limited permissions. Secret keys (like sk_live_) must never be exposed to the client and have full API access. AI tools often confuse these and put secret keys in frontend code.

How do I use environment variables in Next.js?

Create a .env.local file with your keys. Variables prefixed with NEXT_PUBLIC_ are exposed to the browser (use for public keys only). Server-only variables (no prefix) are only available in API routes and server components. Never prefix secret keys with NEXT_PUBLIC_.

Scan your app for security issues automatically

Vibe Eval checks for 200+ vulnerabilities in AI-generated code.

Try Vibe Eval

AI Coding Security Insights.
Ship Vibe-Coded Apps Safely.

Effortlessly test and evaluate web application security using Vibe Eval agents.

GET STARTED GET A DEMO