Api key woking locally but not after deployment

[giuyosa]

Hello,

My site name is https://griffwong.netlify.app/

I am using environment variables to hide my api keys. My Email form works locally, but not after deployment. Am I inputting my environment variables in the configuration settings correctly?

For example, if my API key is

VITE_API_Key : “abc”

On Netlify in the configuration settings, I would input API_key as the key and “abc” as the value right? Or should I simply input abc as the value without the quotation marks?

[dig]

@giuyosa

I would input API_key as the key

You add a key with the exact value you are using.

@giuyosa

Or should I simply input abc as the value without the quotation marks?

You enter the value exactly as you want it. abc !== "abc"

@giuyosa

I am using environment variables to hide my api keys.

If you are using this in front-end code the key will not remain hidden.

[Support Guide] How do I keep my API keys/tokens safe using Netlify Functions?

Last reviewed by Netlify Support - May 2024 With Jamstack sites, using API keys/tokens to make API calls to other services is a frequent pattern. In some cases, you may want to hard code the keys in your html, when invoking those API calls - which on a service like Netlify means these keys are now public. Anyone can open their browser dev tools and view them, and of course this can lead to someone abusing this access. In some cases, this is fine. For instance, some types of Firebase and Fauna…

[giuyosa]

Thanks for the heads up on hiding the API Key. I have inputed my key and values into the configuration settings exactly as it is in my .env file. It works locally but not after deployment. Am I missing something?

[dig]

Read this support guide

[Support Guide] Using environment variables on Netlify correctly

Last reviewed: May 2024 The preferred way to use environment variables in Netlify is to set them in our environment - be that in the Environment Variables settings UI (on the site’s “Build & Deploy settings” page), or via netlify.toml. You’ll want to choose the right pattern to meet your needs. Setting variables in our UI may be considered a bit more secure, since only people with access to the Netlify admin UI for your site can see them, rather than “anyone who can clone your repo!”. These v…

Based on the information you’ve provided I can offer no further advice.

[LanLiDev]

Did you ever get this figured out? Something I am trying to deploy is demanding I have my info in a supabaseClient.js but that info should be pulled from the env set up in netlify. The project I am working on has the env setup to have a vari for supabaseUrl, supabaseAnonKey like the docs, people and ai says I should do.

[hrishikesh]

If you need help, you should share the site name and reproduction steps.