How to Hide API Keys in Bolt
In Bolt V2, store API keys in Project Settings under the secrets section. Access them through Edge Functions, which act as a secure tunnel between your app and third-party services. Never put keys directly in your code — they'll end up in the frontend JavaScript bundle.
Why this matters
Bolt.new generates full-stack apps that run in WebContainers during development. But once deployed, your frontend code is publicly visible. Any API key in a client-side file is accessible through the browser's DevTools.
What's at stake
Exposed API keys can lead to unauthorized charges, data access, and service abuse. Since Bolt apps support multiple deployment targets (Netlify, Vercel, Bolt Cloud), keys need to be managed correctly regardless of where you deploy.
Step by step.
Open Bolt V2 Project Settings
Navigate to your project settings in Bolt V2. The secrets management section allows you to store API keys and credentials securely.
Add your API key as a secret
Enter the key name (e.g., OPENAI_API_KEY) and value. The secret is stored securely and not included in your frontend code.
Create an Edge Function for the API call
Ask Bolt to create an Edge Function that uses the secret. For example: "Create a server function that calls OpenAI using my API key from secrets." Edge Functions run server-side where secrets are protected.
Update frontend code to call the Edge Function
Replace direct API calls in your frontend with calls to your Edge Function. Your frontend sends the request to the Edge Function, which adds the API key and forwards to the external service.
Verify in the deployed app
Deploy your app and open DevTools (F12) > Sources. Search for your API key string. If it appears in the JavaScript files, it is still exposed and needs to be moved server-side.
Detect and prevent API key exposure in Bolt apps
- Automated scanning for exposed keys in deployed Bolt applications
- Alerts when secrets are found in frontend code
- Remediation guide for moving keys to Edge Functions
Keep learning.
Frequently asked questions.
Bolt V2 provides secrets management in Project Settings and Edge Functions for secure access. But you must use these features — if you type a key directly in code, Bolt will include it in the frontend bundle.
WebContainers provide isolation during development, but the key concern is the deployed app. Even if development is secure, a deployed app with hardcoded keys exposes them to anyone.
The approach is the same regardless of deployment target. Store keys in Project Settings and access through Edge Functions. This works whether you deploy to Bolt Cloud, Netlify, Vercel, or Cloudflare.