I am facing a strange error with fetch API in React.
TypeError: Failed to execute ‘fetch’ on ‘Window’: Failed to parse URL from http://localhost:5000/api/v1/subroute/subroute2/lastXdays?rank=10&pageSize=5¤tPage=0&genre=Something&format=69&sort=Somecriteria
However when I remove the :5000
part from URL (and run the localhost server on port 80), it works fine.
Here is my fetch call:
const response = await fetch(`${baseUrl}/api/v1/subroute/subroute2/lastXdays?rank=${rank}&pageSize=${pageSize}¤tPage=${currentPage}&genre=${genre}&format=${formatId}&sort=${sort}` , { method: 'GET', headers: { 'Content-Type': 'application/json', 'token': token } }); return await response.json();
Why is it happening?
My server is running on port 5000 and it’s confirmed.
Advertisement
Answer
You have an invisible character just after the port number, remove it. Btw, if you copy-paste the URL into the DevTools console in Chrome, it will show the invisible character as a dot.