Expected a JSON object, array or literal.json

Question

I have a JSON file I use to store quotes for some Quote Generator I'm building. Recently I got this error in my terminal (see screenshot below).

Expected a JSON object, array or literal.json

This is what my JSON looks like

data = [
{
    "number": "1",
    "author": "Von R. Glitschka",
    "quote": "The client may be king, but he's not the art director."
},
{
    "number": "2",
    "author": "Frank Capra",
    "quote": "A hunch is creativity trying to tell you something."
},
{
    "number": "3",
    "author": "Steven Heller",
    "quote": "As a profession, graphic designers have been shamefully remiss or ineffective about plying their craft for social or political betterment."
}]

I've tried all I could. but the error keeps coming, what could be wrong?

enter image description here

It'd help to see the stack trace and what led to the error. What action are you trying to perform that yields this error? — proton, Dec 17 '18 at 22:13
Although it still works fine, quotes are served even with this error, but I still feel something is wrong? — Bolaji Ayodeji, Dec 17 '18 at 22:16
This is a valid array, can you tell us how you are calling it? Show us the code that is using it? — Sara Chipps, Dec 17 '18 at 22:16
This is the JavaScript code that is using this JSON `console.log(data); var random = Math.floor(Math.random() * 50); document.getElementById('quote').innerHTML = data[random].quote; document.getElementById('author').innerHTML = data[random].author;` — Bolaji Ayodeji, Dec 17 '18 at 22:17
sigh.. you put javascript in a json file. remove the javascript and leave the json. — Kevin B, Dec 17 '18 at 22:22
Yeah! Was about to ask that, is the data contained in `.js` file or `.json` file? — proton, Dec 17 '18 at 22:22

score 11 · Answer 1 · edited Jan 21 '19 at 11:03

You just need to format your file a bit like this:

{
  "data" : [
    {
        "number": "1",
        "author": "Von R. Glitschka",
        "quote": "The client may be king, but he's not the art director."
    },
    {
        "number": "2",
        "author": "Frank Capra",
        "quote": "A hunch is creativity trying to tell you something."
    },
    {
        "number": "3",
        "author": "Steven Heller",
        "quote": "As a profession, graphic designers have been shamefully remiss or ineffective about plying their craft for social or political betterment."
    }]
}

And save this with a .json extension.

score 0 · Answer 2 · edited Mar 30 '23 at 13:12

0

I had a similar problem but finally figured it out like this: firstly, you need to make sure you have an eslintrc.json file, and then inside that json file you add this json object:

{
  "extends": [
    "plugin:react/recommended",
    "plugin:@typescript-eslint/recommended",
    "plugin:prettier/recommended"
  ]
}

which also works if you've a typescript or prettier errors.

edited Mar 30 '23 at 13:12

Siddhartha Mukherjee

2,703
2
24
29

answered Mar 25 '23 at 20:50

Hudu Fodio

1
1

score 0 · Answer 3 · answered Apr 04 '23 at 11:06

0

The error occurred for me but mine one just gone by changing file extension form json to js.

answered Apr 04 '23 at 11:06

Ehsan Ellahi

11
2

Sara Chipps · Answer 4 · 2018-12-17T22:25:23.290

-2

It looks like, given the data you have and the code you are using to get a random number, your number is often exceeding the number of objects you have in your array.

For example,

Math.floor(Math.random() * 50)

Could end up setting random to 13, which greatly exceeds the number of values in your array.

If you would like to get a random number between 0 and 2, you can use:

random = Math.floor(Math.random() * Math.floor(3));

edited Dec 17 '18 at 22:25

answered Dec 17 '18 at 22:22

Sara Chipps

9,322
11
58
103

How do I fix this? – Bolaji Ayodeji Dec 17 '18 at 22:24
I still get the error in my JSON. My js still works fine and the quotes render fine but the error still pops up in my JSON? – Bolaji Ayodeji Dec 17 '18 at 22:47
I see what is happening, the reason why you are getting an error is because you can't create variables in a JSON file. I would move that code over to your JS file. – Sara Chipps Dec 17 '18 at 22:55
I thought as much, someone gave that suggestion. – Bolaji Ayodeji Dec 17 '18 at 23:07
Is there no other method to do this with JSON without moving to JS and still get no error? – Bolaji Ayodeji Dec 17 '18 at 23:08
You could not set it as a variable and read the JSON file this way: https://stackoverflow.com/questions/19706046/how-to-read-an-external-local-json-file-in-javascript – Sara Chipps Dec 17 '18 at 23:10

score -3 · Answer 5 · answered Dec 17 '18 at 22:26

-3

An alternate approach to this is

data = [
{
"number": "1",
"author": "Von R. Glitschka",
"quote": "The client may be king, but he's not the art director."
},
{
"number": "2",
"author": "Frank Capra",
"quote": "A hunch is creativity trying to tell you something."
},
{
"number": "3",
"author": "Steven Heller",
"quote": "As a profession, graphic designers have been shamefully remiss or ineffective about plying their craft for social or political betterment."
}];

console.log(data);
var random = Math.floor(Math.random() * data.length); 
console.log(data[random].quote);
console.log(data[random].author);

answered Dec 17 '18 at 22:26

proton

1,639
6
18
30

Because the length of the array is dynamic it makes sense to use `data.length` as the limit for generating a random number so in the event it changes you are certain it'll never be out of range. – proton Dec 17 '18 at 22:27
Actually, my code still works and I tried your's it worked too. But the error is pooping in my JSON and I don't know why? – Bolaji Ayodeji Dec 17 '18 at 22:30
Thanks for the `data.length` reminder. I was actually updating the data length manually but it makes more sense to make it dynamic as you rightly said. – Bolaji Ayodeji Dec 17 '18 at 22:31

Ola John Ajiboye · Answer 6 · 2018-12-17T22:49:15.193

Well first, this isn't exactly a JSON format. This is an array of objects. Your JSON can not have a variable assignment like the one you have var data = ..... Depending on why you are getting the error or what you intend to do with the data. You have 2 options:

Convert this array into an acceptable JSON object, like so: $ JSON.stringify(data).
You can work with this data directly as an array that it is, just by storing it either as a js variable or in a js file. Then you can easily manipulate it like an array.

Expected a JSON object, array or literal.json

6 Answers6

Linked