Question 193749 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – Issues accessing variables from .env file

I have been trying to get my API key from my .env file that is at the root of my folder to a JSX file where I want to do the fetching, but each time I use process.env.{MY_VARIABLE_NAME} the browser console returns an error:

ReferenceError: process is not defined

The line where I am trying to get data from the API:

const api = await axios.get(`https://api.spoonacular.com/recipes/random?apikey=${process.env.RECIPE_API_KEY}`)

I checked around and I have tried installing dotenv and it still not works

Can anyone help with this, and if there is any more information that will be needed, I am available to provide it.

Tags:

3

Answers


  1. 0

    The process object is not available in the client side javascript environment, if you were running this on server side runtime it would work.

    Login or Signup to reply.
  2. 0

    You may try by assigning it to the variable and then use it as:

    const API= process.env.RECIPE_API_KEY;
const api = await axios.get(`https://api.spoonacular.com/recipes/random?apikey=${API}`)

    I think this will work

    Login or Signup to reply.
  3. 0

    If you’re not using a React app or a bundler like Webpack, and you want to use environment variables directly on the client side without any build process, you can expose the environment variables in your server’s response and access them in your client-side JavaScript code.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search