I have a React project made with CRA which fetches data from the New York Times API (NYT Times Wire API, to be precise). Until this point I kept the API key inside a component, everything worked well in those circumstances. Then I created an .env
file in the root directory (where package.json
is) and moved the API key there as REACT_APP_NYT_API_KEY=apiKeyItself
. Inside of the component I use it as
const apiKey = process.env.REACT_APP_NYT_API_KEY;
const [url, setUrl] = useState(
`https://api.nytimes.com/svc/news/v3/content/nyt/homepage.json?limit=100&offset=${urlOffset}&api-key=${apiKey}`
);
In the console, both apiKey and URL are logged correctly, there is no difference compared to when the apiKey was held in a component, however the NYT API now responds with 401 (unauthorized) and I can’t figure out why.