Vue.js; How do I get local JSON file using Axios?

SwedieK 0
Viewed 45

I'm wondering how I wonder how I can read a local JSON file using Axios?` The data.json file is located in public/info/data.json? Every time I'm trying to pull off the get request, I'm getting a 404 message

Data.json looks like this:
[
{"id": 1239,"name": "Card 1"},
{"id": 1235,"name": "Card 2"},
{"id": 1233,"name": "Card 3"},
{"id": 1233,"name": "Card 4"},

]

Get method looks like this: 
  created() {
  axios.get("../../public/data/data.json")
  .then((response) => {
      response.data
  })
vue.js javascript
2 Answers

If it's on local, you cannot get it with Axios using path. You can import your local file directly

import jsondata from '../your-data.json'

Axios only can do network request, so if your json path are on /public/data.json. You can request it like this

const response = await axios('http://localhost:3000/public/data.json')
mandaputtra0

You can put your json into project's public static directory, your json file locates at ~project/public/data/data.json, request like this

axios.get("/data/data.json", {
    baseURL: "/",
  })
userFJpw0
Related