I have an api key but still get a 401 error

Question

My website won't connect to the OMDB api. It's a React app, deployed through Netlify. When I run the app on local host 3000 it connects no problem. Any help with this is greatly appreciated.

This is how I have my api key set up in App.js:

searchMovies = async (text) => {
    try {
      const API_KEY = process.env.REACT_APP_API_MOVIE_KEY;
      const response = await axios.get(
        `https://www.omdbapi.com/?apikey=${API_KEY}&`,
        {
          params: { s: text, type: 'movie' },
        }
      );

This is what the .env file looks like:

REACT_APP_API_MOVIE_KEY=*****

This is what the environment variables on Netlify look like:

key: API_KEY value: *****

And here is the error code I get:

Failed to load resource: www.omdbapi.com/?apikey=undefined&&s=kate&type=movie:1 Failed to load 
the server responded with a status of 401 ()

Answer 1

IMDb ID missing in the url: example http://www.omdbapi.com/?i={imdb id}&apikey={api key}