SyntaxError: Unexpected token o in JSON at position 1 – Dev

The best answers to the question “SyntaxError: Unexpected token o in JSON at position 1” in the category Dev.

QUESTION:

I’m parsing some data using a type class in my controller. I’m getting data as follows:

{  
   "data":{  
      "userList":[  
         {  
            "id":1,
            "name":"soni"
         }
      ]
   },
   "status":200,
   "config":{  
      "method":"POST",
      "transformRequest":[  
         null
      ],
      "transformResponse":[  
         null
      ],
      "url":"/home/main/module/userlist",
      "headers":{  
         "rt":"ajax",
         "Tenant":"Id:null",
         "Access-Handler":"Authorization:null",
         "Accept":"application/json, text/plain, */*"
      }
   },
   "statusText":"OK"
}

I tried to store the data like this

var userData = _data;
var newData = JSON.parse(userData).data.userList;

How can I extract the user list to a new variable?

ANSWER:

The first parameter of the JSON.parse function is expected to be a string, and your data is a JavaScript object, so it will coerce it to the string "[object Object]". You should use JSON.stringify before passing the data:

JSON.parse(JSON.stringify(userData))

ANSWER:

The JSON you posted looks fine, however in your code, it is most likely not a JSON string anymore, but already a JavaScript object. This means, no more parsing is necessary.

You can test this yourself, e.g. in Chrome’s console:

new Object().toString()
// "[object Object]"

JSON.parse(new Object())
// Uncaught SyntaxError: Unexpected token o in JSON at position 1

JSON.parse("[object Object]")
// Uncaught SyntaxError: Unexpected token o in JSON at position 1

JSON.parse() converts the input into a string. The toString() method of JavaScript objects by default returns [object Object], resulting in the observed behavior.

Try the following instead:

var newData = userData.data.userList;

ANSWER:

Just above JSON.parse, use:

var newData = JSON.stringify(userData)

ANSWER:

Don’t ever use JSON.parse without wrapping it in try-catch block:

// payload 
let userData = null;

try {
    // Parse a JSON
    userData = JSON.parse(payload); 
} catch (e) {
    // You can read e for more info
    // Let's assume the error is that we already have parsed the payload
    // So just return that
    userData = payload;
}

// Now userData is the parsed result