Fetch Data from an HTTP Server in a React Native Application using fetch or axios

Share this video with your friends

In this lesson we’ll use fetch to get data from an HTTP server, and store it in state in our React Native application. fetch works almost identically on the web and React Native - with the possible exception of how it handles cookies. We’ll also take a look at axios - which is an alternative to fetch.

subhash surana

~ 5 years ago

Hi Chris, I am having trouble fetching remote data even I have used json-server to get the restaurants.json file from local server but still empty array is being returned. I tried many things and even axios is also not returning the data from the server. Is there any issue at android side that we can access localhost address so what are the steps to access the local pc address with port as I have difficulty in this regard. Please assist.

Below is my sample restaurants.json file {"restaurants":[ {"name": "React Cafe", "address": "123 St. Chappel St." }, {"name": "Fancy Restaurant", "address": "799 Riverside Road" }, {"name": "Asiad Veggie Bites", "address": "550 marcus street" } ]}

Chris Achard(instructor)

~ 5 years ago

@subhash: From android, try accessing it from your local IP instead of localhost; find the ip of your computer and then use that - does that work?

If you're still having trouble: are you able to fetch it from the browser? So, if you copy the url that you're using with axios or fetch and paste it in a browser, then you should get the json back; if not, then it's a server issue (or you have the wrong url) - if so, then it's a client/app issue.