0

I am working on a simple React-Flask App which aims to fetch the current time from the Back-end and display it on the Front-end.

I have the Flask Back-end and the React Front-end both running together at the same time.

The back-end is working perfectly fine on port 5000:

Back-end

Fetch call '/time' from the front-end is unable to fetch the current time even tho I have my proxy defined in the package.json:

  "proxy": "http://localhost:5000"

Front-end:

function App() {
  const [currentTime, setCurrentTime] = useState(0);

  const getCurrentTime = async (API) => {
    const response = await fetch(API);
    const jsonData = await response.json();
    setCurrentTime(jsonData.time);
    console.log(jsonData);
  };

  useEffect(() => {
    // getCurrentTime('http://localhost:5000/time');
    getCurrentTime('/time');
  }, []);

I have tried the methods discussed here. But none of them seems to work for me.

M Umer Masood
  • 51
  • 5
  • Add eventual `Exceptions` thrown, logs, warnings, etc... Do you receive data here ? `console.log(jsonData);` . Whats' http status of response ? Is your be route even reached, or it can't be reached? Do you have CORS errors? Try to add the more info you can when you post questions like this one which is specific to your situation. – Cesare Polonara Apr 09 '22 at 10:17
  • 2
    Thank you for replying to my post. I'm sorry I didn't include all the details since this was my first question here. But I'll make sure to keep that in mind for next time. Also, I managed to resolve this error by changing the `"proxy": "http://localhost:5000"` to `"proxy": "http://127.0.0.1:5000"`. [this solution](https://stackoverflow.com/a/51926135/18483394) worked for me. The reason why I was getting this error is that I didn't know that I have to restart the development server after making changes in the `package.json`. So I was stuck on this for more than a day. – M Umer Masood Apr 10 '22 at 11:27

1 Answers1

0

"proxy": "http://127.0.0.1:5000". this solution worked for me. The reason why I was getting this error is that I didn't know that I have to restart the development server after making changes in the package.json.

This worked for me

prakash c kesavan
  • 1
  • 2