Fetch local JSON file from public folder ReactJS Fetch local JSON file from public folder ReactJS javascript javascript

Fetch local JSON file from public folder ReactJS


I think your fetch argument is wrong. It should be

fetch('data/mato.json')


As long as data files are placed in public folder, it should work in Chrome also as in my project.So, fetch('data/mato.json') is enough for it.


You also need to pass in some headers indicating the Content-Type and Accept as application/json to tell your client that you are trying to access and accept some JSON resource from a server.

  const getData=()=>{    fetch('data/mato.json'    ,{      headers : {         'Content-Type': 'application/json',        'Accept': 'application/json'       }    }    )      .then(function(response){        console.log(response)        return response.json();      })      .then(function(myJson) {        console.log(myJson);      });  }  useEffect(()=>{    getData()  },[])