ChatGPT解决这个技术问题 Extra ChatGPT

Uncaught SyntaxError: Unexpected token with JSON.parse

what causes this error on the third line?

var products = [{ "name": "Pizza", "price": "10", "quantity": "7" }, { "name": "Cerveja", "price": "12", "quantity": "5" }, { "name": "Hamburguer", "price": "10", "quantity": "2" }, { "name": "Fraldas", "price": "6", "quantity": "2" }]; console.log(products); var b = JSON.parse(products); //unexpected token o

Open console to view error

You don't have any JSON? It's an array/object literal.

S
SLaks

products is an object. (creating from an object literal)

JSON.parse() is used to convert a string containing JSON notation into a Javascript object.

Your code turns the object into a string (by calling .toString()) in order to try to parse it as JSON text.
The default .toString() returns "[object Object]", which is not valid JSON; hence the error.


is it not an Array? Why is it an object. Objects start with { and arrays start with [? or am i false here
Arrays are objects; that's what .toString() returns (as per the spec).
Is the solution to stringify the object first?
@MohammedNoureldin: No; the solution is to do nothing and use your object.
What if I get my data from a remote service using Ajax, which gives me Json response back? And I want that response to be saved in JavaScript array object?
E
EdH

Let's say you know it's valid JSON but your are still getting this...

In that case it's likely that there are hidden/special characters in the string from whatever source your getting them. When you paste into a validator, they are lost - but in the string they are still there. Those chars, while invisible, will break JSON.parse()

If s is your raw JSON, then clean it up with:

// preserve newlines, etc - use valid JSON
s = s.replace(/\\n/g, "\\n")  
               .replace(/\\'/g, "\\'")
               .replace(/\\"/g, '\\"')
               .replace(/\\&/g, "\\&")
               .replace(/\\r/g, "\\r")
               .replace(/\\t/g, "\\t")
               .replace(/\\b/g, "\\b")
               .replace(/\\f/g, "\\f");
// remove non-printable and other non-valid JSON chars
s = s.replace(/[\u0000-\u0019]+/g,""); 
var o = JSON.parse(s);

Got a trailing special character after Base64 decoding, your method helped me a lot! Thx
don't trust a source responding with invalid JSON. Just inform them that the data is corrupt. they should fix it. if you try to "recover" the response like this or in similar ways, you'll be keeping an unstable communication.
Should be s = s.replace(/[\u0000-\u001F]+/g,""); instead of s = s.replace(/[\u0000-\u0019]+/g,""); , for replacing all the control characters. Right?
what is the logic behind s.replace(/\\n/g, "\\n") I tested that, it applies to e.g. "abc\\ndef".replace(/\\n/g,"\\'"); it'd turn it into abc\'def why do you want to do that? Does json not allow ending a line with a backslash.. can you comment a bit about what your examples do and why
Thanks, this really helps. Especially when you copy JSON to clipboard and there were hidden special endline characters in the console.
O
Onur Yıldırım

It seems you want to stringify the object, not parse. So do this:

JSON.stringify(products);

The reason for the error is that JSON.parse() expects a String value and products is an Array.

Note: I think it attempts json.parse('[object Array]') which complains it didn't expect token o after [.


Worked for me. I stringified all array elements and array itself. Then json.parse() was successful.
Why would you do this though? It's already an object. Why stringify it only to parse it back to an object again?
@Clonkex to write it to a file, to post as text, to print on the document, to make a string search, to persist in a database, to debug, to make fun of it and a few other reasons...
My point is that you wouldn't stringify and then immediately parse. That would be pointless (unless you're trying to do a deep copy or something weird like that). Maybe you're saying to replace parse with stringify, but it sounds like you're saying to first stringify so that the parse works (which, as I say, would be pointless).
I don't know how you got "first stringify" from the answer but added "not parse" to be clear..
f
fragilewindows

I found the same issue with JSON.parse(inputString).

In my case the input string is coming from my server page [return of a page method].

I printed the typeof(inputString) - it was string, still the error occurs.

I also tried JSON.stringify(inputString), but it did not help.

Later I found this to be an issue with the new line operator [\n], inside a field value.

I did a replace [with some other character, put the new line back after parse] and everything is working fine.


The new line character was also my problem. So how can we restore such data?
@kolenda You have invalid JSON. You need to change your server to use an actual JSON serializer that returns valid JSON.
I had a similar issue but instead of "\n" I had a "\e" inside a path (I changed the server side code to use "/" instead of "\" and everything was working again)
use an escape wherein \n would be \\n
I replaced it with
- worked for me - data = data.replaceAll('\n','\\u003cbr\\u003e')
T
Térence

JSON.parse is waiting for a String in parameter. You need to stringify your JSON object to solve the problem.

products = [{"name":"Pizza","price":"10","quantity":"7"}, {"name":"Cerveja","price":"12","quantity":"5"}, {"name":"Hamburguer","price":"10","quantity":"2"}, {"name":"Fraldas","price":"6","quantity":"2"}];
console.log(products);
var b = JSON.parse(JSON.stringify(products));  //solves the problem

F
F1Krazy

You should validate your JSON string here.

A valid JSON string must have double quotes around the keys:

JSON.parse({"u1":1000,"u2":1100})       // will be ok

If there are no quotes, it will cause an error:

JSON.parse({u1:1000,u2:1100})    
// error Uncaught SyntaxError: Unexpected token u in JSON at position 2

Using single quotes will also cause an error:

JSON.parse({'u1':1000,'u2':1100})    
// error Uncaught SyntaxError: Unexpected token ' in JSON at position 1

In my case, Grails 2.5.6 rendered render ([key: value]) with single quotes, leading to the JSON parseError at position 1 in jquery Ajax. render (groovy.json.JsonOutput.toJson ([key:value])) helped me out.
p
pktangyue
products = [{"name":"Pizza","price":"10","quantity":"7"}, {"name":"Cerveja","price":"12","quantity":"5"}, {"name":"Hamburguer","price":"10","quantity":"2"}, {"name":"Fraldas","price":"6","quantity":"2"}];

change to

products = '[{"name":"Pizza","price":"10","quantity":"7"}, {"name":"Cerveja","price":"12","quantity":"5"}, {"name":"Hamburguer","price":"10","quantity":"2"}, {"name":"Fraldas","price":"6","quantity":"2"}]';

@SLaks yep,OP can use products directly. but if he want use JSON.parse, the args need be a string.
what should i do in ASP Classic because ' is comment
@ashishbhatt you can use ", then change all other " to \"
Something like this JSON.parse(products.replace(/'/g, '"'))
a
att

If there are leading or trailing spaces, it'll be invalid. Trailing/Leading spaces can be removed as

mystring = mystring.replace(/^\s+|\s+$/g, "");

Source: http://www.toptip.ca/2010/02/javascript-trim-leading-or-trailing.html


t
tmurphree

Here's a function I made based on previous replies: it works on my machine but YMMV.

          /**
             * @description Converts a string response to an array of objects.
             * @param {string} string - The string you want to convert.
             * @returns {array} - an array of objects.
            */
            function stringToJson(input) {
              var result = [];

              //replace leading and trailing [], if present
              input = input.replace(/^\[/,'');
              input = input.replace(/\]$/,'');

              //change the delimiter to 
              input = input.replace(/},{/g,'};;;{');

              // preserve newlines, etc - use valid JSON
              //https://stackoverflow.com/questions/14432165/uncaught-syntaxerror-unexpected-token-with-json-parse
            input = input.replace(/\\n/g, "\\n")  
            .replace(/\\'/g, "\\'")
            .replace(/\\"/g, '\\"')
            .replace(/\\&/g, "\\&")
            .replace(/\\r/g, "\\r")
            .replace(/\\t/g, "\\t")
            .replace(/\\b/g, "\\b")
            .replace(/\\f/g, "\\f");
            // remove non-printable and other non-valid JSON chars
            input = input.replace(/[\u0000-\u0019]+/g,""); 

              input = input.split(';;;');

              input.forEach(function(element) {
                // console.log(JSON.stringify(element));

                result.push(JSON.parse(element));
              }, this);

              return result;
            }

c
c00000fd

One other gotcha that can result in "SyntaxError: Unexpected token" exception when calling JSON.parse() is using any of the following in the string values:

New-line characters. Tabs (yes, tabs that you can produce with the Tab key!) Any stand-alone slash \ (but for some reason not /, at least not on Chrome.)

(For a full list see the String section here.)

For instance the following will get you this exception:

{
    "msg" : {
        "message": "It cannot
contain a new-line",
        "description": "Some discription with a     tabbed space is also bad",
        "value": "It cannot have 3\4 un-escaped"
    }
}

So it should be changed to:

{
    "msg" : {
        "message": "It cannot\ncontain a new-line",
        "description": "Some discription with a\t\ttabbed space",
        "value": "It cannot have 3\\4 un-escaped"
    }
}

Which, I should say, makes it quite unreadable in JSON-only format with larger amount of text.


h
hering
[
  {
    "name": "Pizza",
    "price": "10",
    "quantity": "7"
  },
  {
    "name": "Cerveja",
    "price": "12",
    "quantity": "5"
  },
  {
    "name": "Hamburguer",
    "price": "10",
    "quantity": "2"
  },
  {
    "name": "Fraldas",
    "price": "6",
    "quantity": "2"
  }
]

Here is your perfect Json that you can parse.


C
Chris

Hopefully this helps someone else.

My issue was that I had commented HTML in a PHP callback function via AJAX that was parsing the comments and return invalid JSON.

Once I removed the commented HTML, all was good and the JSON was parsed with no issues.


M
Manjunath Reddy

When you are using POST or PUT method, make sure to stringify the body part.

I have documented an example here https://gist.github.com/manju16832003/4a92a2be693a8fda7ca84b58b8fa7154


K
Kiran Maniya

The only mistake you are doing is, you are parsing already parsed object so it's throwing error, use this and you will be good to go.

var products = [{ "name": "Pizza", "price": "10", "quantity": "7" }, { "name": "Cerveja", "price": "12", "quantity": "5" }, { "name": "Hamburguer", "price": "10", "quantity": "2" }, { "name": "Fraldas", "price": "6", "quantity": "2" }]; console.log(products[0].name); //name of item at 0th index

if you want to print entire json then use JSON.stringify()


i
ic3b3rg

products is an array which can be used directly:

var i, j;

for(i=0;i<products.length;i++)
  for(j in products[i])
    console.log("property name: " + j,"value: "+products[i][j]);

P
Pacerier

Now apparently \r, \b, \t, \f, etc aren't the only problematic chars that can give you this error.

Note that some browsers may have additional requirements for the input of JSON.parse.

Run this test code on your browser:

var arr = [];
for(var x=0; x < 0xffff; ++x){
    try{
        JSON.parse(String.fromCharCode(0x22, x, 0x22));
    }catch(e){
        arr.push(x);
    }
}
console.log(arr);

Testing on Chrome, I see that it doesn't allow JSON.parse(String.fromCharCode(0x22, x, 0x22)); where x is 34, 92, or from 0 to 31.

Chars 34 and 92 are the " and \ characters respectively, and they are usually expected and properly escaped. It's chars 0 to 31 that would give you problems.

To help with debugging, before you do JSON.parse(input), first verify that the input doesn't contain problematic characters:

function VerifyInput(input){
    for(var x=0; x<input.length; ++x){
        let c = input.charCodeAt(x);
        if(c >= 0 && c <= 31){
            throw 'problematic character found at position ' + x;
        }
    }
}

W
Well Smith

Oh man, solutions in all above answers provided so far didn't work for me. I had a similar problem just now. I managed to solve it with wrapping with the quote. See the screenshot. Whoo.

https://i.stack.imgur.com/E5H4x.png

Original:

var products = [{ "name": "Pizza", "price": "10", "quantity": "7" }, { "name": "Cerveja", "price": "12", "quantity": "5" }, { "name": "Hamburguer", "price": "10", "quantity": "2" }, { "name": "Fraldas", "price": "6", "quantity": "2" }]; console.log(products); var b = JSON.parse(products); //unexpected token o


You didnt solve it, you just made the whole thing a string
Didn't think that time. Brain can't work. Thank you @NotSoShabby
S
Shashank Bodkhe

The error you are getting i.e. "unexpected token o" is because json is expected but object is obtained while parsing. That "o" is the first letter of word "object".


E
Elvis Silva Noleto

It can happen for a lot of reasons, but probably for an invalid char, so you can use JSON.stringify(obj); that will turn your object into a JSON but remember that it is a JQUERY expression.


F
Faraz Ahmed

In my case there is following character problems in my JSON string

\r \t \r\n \n : "

I have replaced them with another characters or symbols, and then revert back again from coding.


M
MD SHAYON

This is now a JavaScript Array of Object, not JSON format. TO convert it into JSON format you need to use a function called JSON.stringify()

JSON.stringify(products)

A
Abhijit Padhy

Why you need JSON.parse? It's already in array of object format.

Better use JSON.stringify as below : var b = JSON.stringify(products);

This may help you.


A
Aashutosh Rathi

The mistake I was doing was passing null (unknowingly) into JSON.parse().

So it threw Unexpected token n in JSON at position 0

But this happens whenever you pass something which is not JS Object in JSON.parse()


J
Jawa

Use eval. It takes JavaScript expression/code as string and evaluates/executes it.

eval(inputString);

Each invocation of eval() creates a new instance of the JavaScript interpreter. This can be a resource hog.
This was the ONLY option that worked for me. Thanks
usage of eval is highly discouraged, especially if you retrieve your data through an api, since it will leave you vulnrable to security issues and malicious attacks