CODEWITHSUNDEEP
jsonvue.jsaxios
Joachim Tillessen
Joachim Tillessen

Reputation: 63

loading json files with axios.get from static directory

In my vue.js App I have been loading all the data from an API that I have configured as baseURL in my nuxt.config.js. Now I want to load a static json file, that does not come from that API. That file will include additional names of files to load depending on user interaction. In order to keep my code consistent I would like to use axios.get to load the static data in the same way I do with API calls. So far I haven't managed to do so.

I placed the json files inside my static directory an have tried to access the files like this:

const { data } = await axios.get(
        '_nuxt/static/json/staticData.json',
        { baseURL: window.location.origin }
      )

I can access other static files like images form the static directory, but the json file generates a 404 error. Should I choose another directory or try a totally different approach?

Upvotes: 0

Views: 2762

Answers (1)

Joachim Tillessen
Joachim Tillessen

Reputation: 63

I included the path segment "_nuxt/static/" because the URL of the rendered image file i checked for reference had it in there too. Turns out this is not the right URL for my Axios call. Code should be written like this:

const { data } = await axios.get(
        '/json/staticData.json',
        { baseURL: window.location.origin }
      )

Upvotes: 3

Related Questions