DEV Community: kb7822836-hash

Unexpected token o in JSON at position 1: why it happens and how to fix it

kb7822836-hash — Tue, 03 Nov 2026 02:20:55 +0000

If you have ever seen Unexpected token o in JSON at position 1 (or "[object Object]" is not valid JSON in newer browsers), you are almost certainly calling JSON.parse() on something that is already an object.

Why it happens

JSON.parse() only accepts text. If you pass an object, JavaScript first converts it to the string [object Object]. The parser reads [ as the start of an array, then hits the letter o at position 1 and fails.

const user = { name: "Ali" };
JSON.parse(user); // SyntaxError

The fix is simple: the value is already an object, so use it directly.

console.log(user.name); // "Ali"

The three most common causes

1. Parsing the result of response.json()

response.json() already parses the body and returns an object.

const res = await fetch("/api/user");
const data = await res.json();   // already an object
console.log(data.name);          // no JSON.parse needed

2. Axios and jQuery parse automatically

Axios puts the parsed body in response.data. jQuery with dataType: "json" also passes an object to the callback. Parsing it again causes this error.

3. Saving an object to localStorage without stringifying

localStorage stores strings only. Saving an object directly stores the text [object Object], and that can never be parsed back.

localStorage.setItem("user", JSON.stringify(user));
const saved = JSON.parse(localStorage.getItem("user"));

If the bad value is already saved, remove it once with localStorage.removeItem("user") and save it again.

A quick way to check what you have

console.log(typeof value);   // "object" means do not parse it
console.log(String(value));  // "[object Object]" confirms this error

If the value is a real string that contains broken JSON, a formatter or repair tool helps. I built a free JSON Repair tool that runs in your browser, so nothing you paste is uploaded.

Full guide

I wrote a longer version with the Firefox wording, more examples and an FAQ here: Unexpected token o in JSON at position 1.

Unexpected token in JSON: the 7 most common causes and how to fix them

kb7822836-hash — Tue, 20 Oct 2026 17:31:14 +0000

You call JSON.parse() and get SyntaxError: Unexpected token .... The message looks vague, but the cause is almost always one of a handful of mistakes. Here are the seven I see most, with a fix for each.

1. A trailing comma

{ "name": "Ana", "age": 30, }

JSON does not allow a comma after the last item. Remove it: { "name": "Ana", "age": 30 }.

2. Single quotes instead of double quotes

{ 'name': 'Ana' }

This is valid JavaScript, but JSON requires double quotes for both keys and strings.

3. Unquoted keys

{ name: "Ana" }

Every key must be a double-quoted string: { "name": "Ana" }.

4. Comments

JSON has no comment syntax. Both // note and /* note */ cause an error, so strip them before parsing.

5. `undefined`, `NaN` or `Infinity`

These are JavaScript values, not JSON values. Use null, or leave the key out. JSON.stringify already drops undefined for you, but hand-written JSON often contains it.

6. You are parsing HTML, not JSON

If you see Unexpected token '<' (or '<' is not valid JSON), the response probably starts with <!DOCTYPE html>. A 404 or 500 error page came back instead of your API data. Check the status code first, then the content type, and log the start of the body if parsing fails:

const res = await fetch(url);
if (!res.ok) throw new Error(`HTTP ${res.status}`);

const type = res.headers.get("content-type") || "";
if (!type.includes("application/json")) {
  throw new Error(`Expected JSON but got ${type}`);
}

const text = await res.text();
try {
  const data = JSON.parse(text);
} catch (err) {
  console.error("Invalid JSON, first 200 chars:", text.slice(0, 200));
  throw err;
}

Some proxies and CDNs return a 200 status with an HTML login or error page, so checking res.ok alone is not enough.

7. Empty or cut-off input

Unexpected end of JSON input means the text ended too early: an empty string, a truncated download, or a missing closing } or ]. Log the raw text before parsing and check that its length and ending look right.

Find the exact spot

Modern engines tell you the position, e.g. at position 42 or line 3 column 5. Paste your JSON into a formatter to jump straight there. I use the free JSON formatter on Parsekit, which runs entirely in your browser, so nothing is uploaded. For a longer list of error messages and their meanings, see the JSON parse errors guide.

Repair instead of editing by hand

If the JSON came from somewhere messy (a log, a chat tool, a copy-paste), a JSON repair tool can fix trailing commas, quotes and similar issues automatically. Always check the result before you rely on it.

Quick checklist

Check the Content-Type header before parsing
Double quotes everywhere
No trailing commas
No comments
Only true, false, null, numbers, strings, arrays, objects
Check res.ok before calling .json()

Which one bites you most often? Tell me in the comments.

How to merge JSON files: JavaScript, Python and jq examples

kb7822836-hash — Sun, 18 Oct 2026 03:00:08 +0000

Merging two JSON files sounds simple until the same key shows up in both. Do you keep the old value, the new one, or combine them? And what happens to arrays? This post shows the common options in JavaScript, Python and jq, and where each one breaks.

First decide what "merge" means

Take two small files:

// a.json
{ "user": { "name": "Ali", "age": 24 }, "tags": ["a", "b"] }

// b.json
{ "user": { "age": 25, "city": "Jhelum" }, "tags": ["b", "c"] }

There are three questions to answer before you write any code:

Shallow or deep? A shallow merge replaces the whole user object. A deep merge keeps name and combines the rest.
Who wins a conflict? Usually the second file (age becomes 25).
What happens to arrays? Join them, replace them, or join them without duplicates.

JavaScript

A shallow merge is one line, but it replaces nested objects completely:

const merged = { ...a, ...b };
// user becomes { age: 25, city: "Jhelum" }, and name is lost

For a deep merge, write a small recursive function. Only plain objects are merged; everything else is replaced by the value from b:

const isPlainObject = (v) => v !== null && typeof v === 'object' && !Array.isArray(v);

function deepMerge(a, b) {
  const out = { ...a };
  for (const key of Object.keys(b)) {
    if (isPlainObject(out[key]) && isPlainObject(b[key])) {
      out[key] = deepMerge(out[key], b[key]);
    } else {
      out[key] = b[key];
    }
  }
  return out;
}

With this version, user is combined correctly, but tags is replaced by ["b","c"]. To join arrays instead, add one more branch:

if (Array.isArray(out[key]) && Array.isArray(b[key])) {
  out[key] = [...out[key], ...b[key]];            // join
  // out[key] = [...new Set([...out[key], ...b[key]])]; // join without duplicates (primitives only)
}

The Set trick only removes duplicates for strings and numbers. For arrays of objects, compare JSON.stringify(item) instead.

Python

Python 3.9 and newer have a dict union operator, but it is also shallow:

import json

with open('a.json') as f1, open('b.json') as f2:
    a, b = json.load(f1), json.load(f2)

merged = a | b   # shallow: nested objects are replaced

A deep merge is the same idea as in JavaScript:

def deep_merge(a, b):
    out = dict(a)
    for key, value in b.items():
        if isinstance(out.get(key), dict) and isinstance(value, dict):
            out[key] = deep_merge(out[key], value)
        else:
            out[key] = value
    return out

To merge many files, fold them with functools.reduce(deep_merge, list_of_dicts).

jq on the command line

If you already work in a terminal, jq does this without any script. The * operator merges objects recursively, and the right side wins:

jq -s '.[0] * .[1]' a.json b.json

Arrays are replaced, not joined. To merge more than two files:

jq -s 'reduce .[] as $x ({}; . * $x)' a.json b.json c.json

Two files that are both top-level arrays can be joined with jq -s '.[0] + .[1]'.

When you just need the result

For a one-off merge you do not need to write or run anything. I built a free Merge JSON tool that merges two JSON files in the browser, so nothing is uploaded. It deep-merges objects, lets you choose how arrays are handled (standard, always join, or join without duplicates) and tells you how many values from the second file replaced a different value from the first. To see exactly what changed afterwards, compare the result with the original in the JSON Diff tool.

Common mistakes

Merging invalid JSON. A trailing comma or single quotes will stop the parser. Check each file with a JSON formatter and validator first.
Expecting arrays to merge by position. None of the examples above match array items by index. They join or replace whole arrays.
Order matters. The second file wins, so merge(a, b) and merge(b, a) can give different results.
Large files. Loading very big files into memory can be slow in a browser. Split them first, or use jq or Python.

Disclosure: I am the author of Parsekit.

How to escape and unescape a JSON string (with JavaScript and Python examples)

kb7822836-hash — Fri, 09 Oct 2026 07:17:00 +0000

Sooner or later you have to put JSON inside a string: a payload stored in a database column, a field in another JSON document, or a line in a log file. That is when quotes, backslashes and line breaks start breaking things. Here is how JSON string escaping works and how to do it correctly.

What gets escaped

Inside a JSON string, these characters must be written with a backslash:

a double quote becomes \"
a backslash becomes \\
a new line becomes \n
a tab becomes \t
a carriage return becomes \r
other control characters become \uXXXX

Writing / as \/ is allowed but not required.

Escape a string in JavaScript

Do not build the escaped text by hand. JSON.stringify does it for you:

const text = 'He said "hi"\nnext line';
const escaped = JSON.stringify(text);
// "He said \"hi\"\nnext line"   (with the surrounding quotes)

Unescape a string in JavaScript

JSON.parse reverses it. It expects the surrounding quotes to be there:

const original = JSON.parse(escaped);
// He said "hi"
// next line

JSON inside JSON (double encoding)

This is the case that confuses most people. When a JSON document is stored as a string inside another one, every quote and backslash gets escaped again:

const inner = { name: "Ali", note: 'He said "hi"' };
const outer = { payload: JSON.stringify(inner) };

JSON.stringify(outer);
// {"payload":"{\"name\":\"Ali\",\"note\":\"He said \\\"hi\\\"\"}"}

To read it back you parse twice:

const data = JSON.parse(JSON.parse(outerText).payload);

Python

import json

s = 'He said "hi"\nnext line'
escaped = json.dumps(s)
print(escaped)
# "He said \"hi\"\nnext line"

original = json.loads(escaped)
print(original == s)
# True

One difference to know: json.dumps escapes non-ASCII characters as \uXXXX by default. Pass ensure_ascii=False to keep them readable. JSON.stringify in JavaScript keeps them as they are.

Unicode escapes

JSON can write any character as \uXXXX, and JSON.parse turns it back into the real character:

JSON.parse('"caf\\u00e9"');
// "café"

In Python, json.dumps("café") gives "caf\u00e9", while json.dumps("café", ensure_ascii=False) gives "café".

Common mistakes

Using replace on quotes only. text.replace('"', '\\"') forgets backslashes and line breaks, and breaks on the first one it meets.
Parsing text that has no quotes. JSON.parse on an escaped string needs the surrounding quotes.
Mixing up escape types. JSON escaping is not URL encoding or HTML escaping. Each one has its own rules.

A quick way without code

If you just need to escape or unescape something once, I made a small free tool for it: JSON Escape and Unescape. Paste your text, press Escape or Unescape, and copy the result. It runs in your browser, so what you paste is not uploaded. The site uses Google Analytics for basic page-view counts, but it never sees your text.

If your problem is a broken JSON file rather than a string, the JSON Repair tool and the guide to common JSON parse errors may help.

How to split a large JSON file in the browser (without uploading it anywhere)

kb7822836-hash — Mon, 05 Oct 2026 03:54:02 +0000

ometimes you get a huge JSON array, a few thousand records in one file, and you need it in smaller pieces. Maybe an API only accepts 500 items at a time, or your editor chokes on the file.

The easy way is to paste it into an online tool. But if the data is private, uploading it to a random server isn't a great idea. Here is how to do it entirely in the browser.

The idea

Parse the JSON, cut the array into groups of N items, and turn each group back into text.

function splitArray(arr, size) {
  const parts = [];
  for (let i = 0; i < arr.length; i += size) {
    parts.push(arr.slice(i, i + size));
  }
  return parts;
}

const data = JSON.parse(text);          // text = your file contents
const parts = splitArray(data, 500);    // 500 items per part

Splitting an object instead of an array

If the top level is an object, split its keys instead:

function splitObject(obj, size) {
  const keys = Object.keys(obj);
  const parts = [];
  for (let i = 0; i < keys.length; i += size) {
    const chunk = {};
    keys.slice(i, i + size).forEach(k => { chunk[k] = obj[k]; });
    parts.push(chunk);
  }
  return parts;
}

Saving each part as a file

Browsers can create a download from a Blob, with no server involved:

function download(name, value) {
  const blob = new Blob([JSON.stringify(value, null, 2)], { type: 'application/json' });
  const a = document.createElement('a');
  a.href = URL.createObjectURL(blob);
  a.download = name;
  a.click();
  URL.revokeObjectURL(a.href);
}

parts.forEach((p, i) => download(`part-${i + 1}.json`, p));

One catch: many browsers block several downloads fired at once, so it is safer to give each part its own download button.

A few things to watch for

Invalid JSON. JSON.parse throws on bad input, so wrap it in try/catch and show the error message to the user.
Very large files. Everything is held in memory, so a file of many megabytes can make the tab slow. For huge files, a streaming parser or a command-line tool is a better fit.
Order. Items keep their original order, so you can join the parts back together later with concat.

If you don't want to write code

I put this into a small free tool: JSON Splitter. Paste your JSON, choose how many items per part, then copy or download each part. It runs fully in your browser, and nothing you paste is uploaded.

It is part of Parsekit, a set of small JSON utilities that all run client-side: formatter, JSON to CSV and YAML, merge, diff, splitter, escape/unescape, Base64 and URL encode/decode. The site uses Google Analytics for basic page-view counts, but it never sees what you paste.

I'd love to hear which tool you'd want next, or if something breaks on an edge-case JSON file.

Built Parsekit: free JSON tools that run entirely in your browser (nothing you paste is uploaded)

kb7822836-hash — Fri, 25 Sep 2026 16:30:28 +0000

Got tired of JSON formatter sites that bury a simple tool behind popups and multi-step wizards, so I built a small collection of single-purpose ones:

JSON Formatter & Validator (with clear error location)
JSON to CSV and JSON to YAML converters
Merge JSON Files (deep merge for objects, concat for arrays)
JSON Diff, JSON Splitter, and JSON Escape/Unescape
Base64 and URL encode/decode

Everything runs client-side: what you paste is processed in your browser and never uploaded. No signup either. The site uses Google Analytics for basic page-view and button-click counts, but it never sees what you paste.

https://parsekit.net

Would love feedback, especially if something breaks on edge-case JSON, or if there's a tool you'd like next.

DEV Community: kb7822836-hash

Unexpected token o in JSON at position 1: why it happens and how to fix it

Why it happens

The three most common causes

A quick way to check what you have

Full guide

Unexpected token in JSON: the 7 most common causes and how to fix them

1. A trailing comma

2. Single quotes instead of double quotes

3. Unquoted keys

4. Comments

5. undefined, NaN or Infinity

6. You are parsing HTML, not JSON

7. Empty or cut-off input

Find the exact spot

Repair instead of editing by hand

Quick checklist

How to merge JSON files: JavaScript, Python and jq examples

First decide what "merge" means

JavaScript

Python

jq on the command line

When you just need the result

Common mistakes

How to escape and unescape a JSON string (with JavaScript and Python examples)

What gets escaped

Escape a string in JavaScript

Unescape a string in JavaScript

JSON inside JSON (double encoding)

Python

Unicode escapes

Common mistakes

A quick way without code

How to split a large JSON file in the browser (without uploading it anywhere)

The idea

Splitting an object instead of an array

Saving each part as a file

A few things to watch for

If you don't want to write code

Built Parsekit: free JSON tools that run entirely in your browser (nothing you paste is uploaded)

5. `undefined`, `NaN` or `Infinity`