title: Axios frontend doesn't seem to pass request parameters to backend
body: <p>I have this hook on react for my frontend to perform http requests to get data to show on page</p>
  <pre><code>useEffect(() =&gt; {
      const options = {
        method: &quot;GET&quot;,
        url: `http://localhost:8080/api/v1/postersgrid`,
        params: { query: props.query },
      };
  
      axios
        .request(options)
        .then((res) =&gt; {
          console.log(res);
          setResults(res.data.results);
          setTotalPages(res.data.total_pages);
          setSuccessfulRequest(true);
        })
        .catch((err) =&gt; {
          console.log(err);
          setSuccessfulRequest(false);
        });
    }, [props.query]);
  </code></pre>
  <p>as you can see that endpoint is mine because i made a little backend for my app</p>
  <pre><code>const express = require(&quot;express&quot;);
  const cors = require(&quot;cors&quot;);
  const axios = require(&quot;axios&quot;);
  
  const PORT = 8080;
  const app = express();
  
  app.use(cors());
  app.listen(PORT, () =&gt; console.log(`Server running on port ${PORT}`));
  
  app.get(&quot;/api/v1/postersgrid&quot;, (req, res) =&gt; {
    const options = {
      method: &quot;GET&quot;,
      url: `https://api.themoviedb.org/3/search/movie?api_key=${APIKEY}&amp;query=${req.query}`,
    };
  
    axios
      .request(options)
      .then((response) =&gt; {
        res.json(response.data);
      })
      .catch((error) =&gt; {
        console.log(error);
      });
  });
  </code></pre>
  <p>this backend communicates with an api of which i have the api key.
  What i want is:</p>
  <ol>
  <li>frontend queries backend where api key is hidden</li>
  <li>backend queries api and returns data to frontend</li>
  </ol>
  <p>Now the problem is when i try to pass parameters from frontend to backend</p>
  <pre><code>const options = {
        method: &quot;GET&quot;,
        url: `http://localhost:8080/api/v1/postersgrid`,
        params: { query: props.query },
      };
  </code></pre>
  <p>here i try to pass it to backend but as soon as i use it in the url to perform http requests to the api it's like it's undefined or null</p>
  <pre><code>url: `https://api.themoviedb.org/3/search/movie?api_key=${APIKEY}&amp;query=${req.query}`,
  </code></pre>
  <p>to prove this works, if i change the query to be static</p>
  <pre><code>url: `https://api.themoviedb.org/3/search/movie?api_key=${APIKEY}&amp;query=war`
  </code></pre>
  <p>everything works as intended, where am I wrong? btw I'm doing all of this instead of performing requests directly from frontend to hide my api key correctly</p>