How do I safely store API keys?
Last checked 31 Aug 2026
Short answer
Store keys as secrets in your backend (Lovable Cloud/Supabase) and call the third-party API from a server/edge function — never put keys in front-end code.
Why this matters
Any string that ends up in your app's front-end code — including anything in a .env file prefixed for the browser — ships to every visitor and is visible in browser dev tools. API keys, especially ones with billing or write access, must never live there.
Where keys belong
Lovable Cloud (and connected Supabase projects) provide Secrets: encrypted values stored server-side and injected only into server/edge functions, never into the shipped front-end bundle.
- Ask Lovable to add the integration you need, e.g. "Connect Stripe and store the secret key securely."
- Lovable creates a secret slot and an edge function that reads it server-side.
- Your front-end calls that edge function; the actual third-party key never reaches the browser.
Add a Resend integration for sending emails. Store the API key as a secret and create an edge function to send the email — don't expose the key to the client.
Secrets vs environment variables
VITE_-prefixed environment variables are bundled into the client and are not secret — they're readable by anyone. Use them only for genuinely public values like a public API base URL. Use Secrets for anything sensitive.
What usually goes wrong
- Pasting a key straight into a component or a
VITE_variable "just to test it" and forgetting to move it before publishing. - Calling a paid third-party API directly from the browser, which both exposes the key and lets anyone rack up usage on your account.
- Assuming a key is safe because it's not printed to the console — the bundled JavaScript itself can be inspected.
Lovable's security review flags exposed keys before you publish, but don't rely on it as your only check — review any integration you set up manually.
See also /questions/how-do-i-use-environment-variables and /questions/what-are-supabase-edge-functions.
Sources
Was this answer helpful?
Related questions
- AnswerHow do I back up my Lovable database?Lovable Cloud stores backups you can restore from directly in the Database screen; for extra safety, also ask Lovable to export your data periodically.
- AnswerHow do I connect Supabase to Lovable?In your Lovable project, open the Supabase integration and authorise Lovable to connect to an existing Supabase project (or create a new one), then Lovable can read and write to it the same way it does with Lovable Cloud.
- AnswerHow do I view my database data?Open the Cloud tab (or ask Lovable) to browse tables, edit rows and run SQL directly inside your project — no separate Supabase login needed.
- AnswerHow do I use environment variables?Use `VITE_`-prefixed variables only for non-sensitive, public values baked into the front-end build; use Secrets for anything sensitive that a server/edge function needs.