-1
axios
  .get(`/?keyword=${queries}`)
  .then(res => {
    setResponse(res);
    console.log("Test----");
    console.table(res);

    setSearching(true);
  })

  .catch(console.log);

Here I'm trying to request a json file from a site that is at a port 5000, my current port for the frontend is port 3000. What is going on? why does this keep happening?

JustForLong
  • 109
  • 8
  • Must be because of this reason, can you check this https://stackoverflow.com/questions/47637435/node-and-reactjs-axios-server-request-returning-index-html-file-instead-of-json – Nayan shah Mar 20 '20 at 17:27

1 Answers1

0

Your URL is a relative one, consisting of just the path. That makes the request to the same:

  • scheme
  • host
  • port

… as the HTML document was loaded from. Since that was from port 3000, the Ajax request is also made to port 3000.

If you want to make the request to a different server, then you need to specify the hostname and port explicitly.

.get(`//example.com:5000/?keyword=${queries}`)
Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335
  • Okay but when I do that, for some reason the browser gives me an error. This error => Access to XMLHttpRequest at 'http://34.94.123.246:5000/?keyword=all' from origin 'http://localhost:3001' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. – JustForLong Mar 20 '20 at 17:48
  • @JustForLong — That's a completely different problem … and one with lots and lots of documentation all over the Internet. https://stackoverflow.com/a/35553666/19068 – Quentin Mar 20 '20 at 17:49