I’m using NUXT, firebase, and sendgrid for a small project I have. I have an API key from sendgrid that works locally when i pass the api key string as such:
const transporter = nodemailer.createTransport({
host: ‘smtp.sendgrid.net’,
port: 587,
secure: false, // upgrade later with STARTTLS
auth: {
user: ‘apikey’,
pass:
‘MY API KEY NUMBER’,
},
})
this works perfectly locally
I have created a .env file that is storing my api key and not commiting to GITHUB. When I deploy the site this way the email form does not work. This is my first time doing something like this and I just cannot figure out where to go from here.
I also added my API KEY to the netlify environment variables section unnder build and deploy and still does not work.
How do i call the api locally (hidden), push to github and netlify and have it grab the correct api key?
Hiya @hendrix617 and sorry to be slow to get back to you! I think this is the advice you need:
The TL;DR is you need to “do something” with that variable - setting it is great for usage during build; for usage at BROWSE time you’ll need to interpolate its values during build, since there is no concept of an “environment” at runtime - just static files that need to have any variables interpolated already.
If you need to hide your API token, that won’t be a good idea - I can see it in your page source. In that case you probably need a function like this one to “hide” the token when using it: