CODEWITHSUNDEEP
javascriptjsonreact-nativeexpofetch-api
Arman viruse
Arman viruse

Reputation: 19

Fetch api Network request failed Expo React Native loading local json file

I am trying to load a static json file locally in my expo managed app as follow.

useEffect(()=>{

getData()},['']);

function getData(){

fetch('../Audio/AudiosObj.json',{'Content-Type':'application/json','Accept': application/json'}).then((data)=>(console.log(data)).catch((err)=>(console.log(err)) }

After running the app I got an error with message "Network request failed". Please what could be the problem?

Upvotes: 0

Views: 838

Answers (1)

rajatkn
rajatkn

Reputation: 31

I think you don't need to use fetch to get the json data. You can simply import the json directly using import statement.

import AudiosObjJSON from '../Audio/AudiosObj.json';

Otherwise if you still want to use fetch, you have provide the headers properly like this:

fetch('../Audio/AudiosObj.json',{
   headers: { 
     'Content-Type': 'application/json',
     'Accept': 'application/json'
   }
})
.then(...)
.catch(...);

But I will still recommend using import statement as they work fine & much more readable than doing a fetch call.

Also, the fetch implementation might not work properly after you compile the app & include all the assets as the relative path might not work.

But when using import statement, the file will be part of the bundle itself & should not cause any issue after it is compiled.

Upvotes: 2

Related Questions