JSON 整形

1. 左の欄に JSON を貼り付けるか、サンプルのボタンで読み込みます。
2. インデント (半角 2 つ・4 つ・タブ・圧縮) を選びます。必要なら「キーを辞書順に並べ替える」も付けます。
3. 構文が壊れているときは、行・列・理由が出ます。よくある壊れ方なら「よくある誤りを直す」、ChatGPT や Claude が出した JSON なら「生成AIのJSONを直す」を付けます。
4. 「コピーする」か「ダウンロードする」で、整形した結果を取り出します。

JSON.parse は、文法に合わない文字列を渡すと例外を投げます。Node 24 (V8 13.6) で確かめたところ、いまはExpected double-quoted property name in JSON at position 7 (line 1 column 8)のように行・列まで文言に含まれます。ただし文言は英語でエンジンごとに違い、すべての実装が行・列を返すとは限りません。

この道具は、ブラウザや Node の実装に頼らず、JSON の文法を定めたRFC 8259に沿った構文解析を自分で書いています。1 文字ずつ読み進めながら行番号と桁番号を数えているので、どの環境で開いても同じ日本語の行・列・理由が出ます。桁はコードポイント単位で数えるので、絵文字のような 2 つの符号単位からなる文字も 1 文字として数えます。全角スペースや全角引用符のように見た目が紛らわしい記号も、名指しで案内します。

よく出る壊れ方と、出している理由

「よくある誤りを直して整形」が直す範囲

上の表の最初の 4 つ (末尾のカンマ、シングルクォート、キーの引用なし、コメント) だけを読み替えて整形します。キーのあとの : が無い、値の区切りの , が無いといった、読み手にも正解が分からない壊れ方は直さず、同じ行・列・理由を出します。直した箇所は、すべて位置つきの一覧で見えます。

多くの整形ツールは、数をいったん JSON.parse で JavaScript の数 (64 ビットの浮動小数点数) にしてから書き戻します。この方法では、18 桁の整数が丸まる、1e400 のような大きさの数が null になる、-0 が 0 になる、といった変化が黙って起きます。

この道具は、数を書かれた文字 (raw) のまま内部に持ち、整形・圧縮でもその文字をそのまま書き出します。JSON.stringify は使っていません。RFC 8259 の 6 節は、安全に相互運用できる整数の範囲を -(2^53)+1 から (2^53)-1 までとし、1E400 のような数は相互運用の問題を示唆すると書いています。API の ID (64 ビット整数が多い) を整形して黙って別の ID になるのは、この種の道具で一番起きやすい壊れ方です。

整形 (半角スペース 2 つ・4 つ・タブ) と圧縮 (1 行に詰める) は、どちらも自前の書き出しで行います。文字列のエスケープは標準の規則に合わせていますが、数は上で説明した通り書かれた文字のまま出すので、ブラウザの JSON.stringify とは数の扱いが違います。

「キーを辞書順に並べ替える」を付けると、オブジェクトのキーだけを並べ替えます。配列の要素は、順番自体に意味のあるデータなので並べ替えません。2 つの JSON を見比べて差分を探すときや、提出物のキー順をそろえたいときに使います。並べ替えを切っている間は、書いた順のまま出します (下の FAQ を参照)。

JSON の値として書けるのは次の 6 種類です。JavaScript でよく使う undefined や NaN、関数、Date のオブジェクトは JSON の値ではありません。

使えない物の代表は、undefined、NaN、Infinity、-Infinity、関数、Date のオブジェクトです。JavaScript の JSON.stringify は、オブジェクトの中の undefined・関数のキーを黙って取り除き、NaN・Infinity は null に変えますが、Date だけは取り除かれず toJSON() で ISO 形式の文字列 (例 "2024-⁠01-⁠01T00:00:00.000Z") に変わります。どれも JSON の文字列として直接書くとエラーになります。「生成AIのJSONを直す」を付けると、NaN・Infinity・undefined だけは null に読み替えます。

ChatGPT や Claude に JSON を作らせると、```json のようなコードフェンスで囲ったり、前後に「こちらが結果です」のような説明文を付けたりすることがよくあります。また、JavaScript 寄りの書き方として NaN や undefined を値に書いてしまうこともあります。「生成AIのJSONを直す」は、これらをまとめて直します。

• コードフェンス (``` や ```json) を、前に説明文があっても探して取り除きます。
• JSON の前後に残った説明文は、最初に出てくる { か [ から、対応する最後の } か ] までを中身とみなして取り除きます。
• NaN、Infinity、-Infinity、undefined は null に読み替えます。
• 末尾のカンマ、シングルクォート、キーの引用なし、コメントも「よくある誤りを直す」と同じく直します。

読み飛ばした範囲は文字列を切り詰めず、位置だけをずらして読んでいるので、残った中身にエラーがあれば、貼り付けた元の文のままの行・列で案内します。何を読み飛ばしたか、何を置き換えたかは「直した箇所」の一覧で確かめられます。AI を使ったコーディングそのものを学びたい人は、下の関係する道具とレッスンの AI コーディングの頁を見てください。

貼り付けた JSON は、このブラウザの中だけで構文解析・整形し、サーバーへの送信も保存もしません。ページを閉じれば入力は消えます。

通信が出ないことの確かめ方

ブラウザの開発者ツールで Network の画面を開き、JSON を貼り付けたり、インデントやキーの並べ替えのボタンを押したりしてください。押しても通信の行が増えないことが分かります。サイト全体のアクセス計測の通信が別に出ることはありますが、貼り付けた JSON の中身は含まれません。

大きな入力 (2,000,000 文字超) と、深すぎる入れ子 (500 階層超) を断る理由

2,000,000 文字を超える入力は、1 文字も解析せずに断ります。手元の計測では、上限いっぱいの 2,000,000 文字 (オブジェクトと配列が合わせて 5 万個ほど) でも構文解析は 1 秒未満で終わりますが、貼り付けの手間や、タブを切り替える操作が重くなるのを避けるための上限です。

配列やオブジェクトの入れ子が 500 階層を超える入力も、それ以上は読まずに断ります。この道具の構文解析は、入れ子が 1 段深くなるたびに関数の呼び出しを 1 段重ねる作りなので、歯止めが無いと壊れた JSON や極端に深い JSON でブラウザの呼び出しスタックを使い切り、道具ごと落ちる恐れがあります。断ったときは、他のエラーと同じように理由を日本語で出します。

普段使っているエディタやコマンドラインで整形したいときの方法です。

VS Code

VS Code の公式ドキュメントには、ファイル全体を整形する Format Document の既定のキー割り当てが、OS ごとに Windows は Shift+Alt+F、macOS は ⇧⌥F (Shift+Option+F)、Linux は Ctrl+Shift+I と書かれています。コマンドパレット (F1 または Ctrl+Shift+P、Mac は Cmd+Shift+P) から Format Document を検索して実行する方法なら、キー割り当てを覚えていなくても使えます。VS Code は JSON 用の整形を標準で持っています。

jq (コマンドライン)

jq が入っていれば、次のように整形できます。数の書き方は変わることがあります (1e400 は 1E+400 に) が、値そのものは変えません。

cat data.json | jq .

python -m json.tool (コマンドライン)

Python が入っていれば、追加のインストールなしで整形できます。ただし 1e400 のような大きすぎる数は JSON にない Infinity に、-0 は 0 に変わります (大きな整数はそのまま保たれます)。数を変えたくないときは、この頁の道具を使ってください。

python -m json.tool data.json

同じ整形を自分のコードに入れたいときの例です。どちらも標準ライブラリの JSON の読み書きだけで、追加のライブラリは要りません。

Python の例

import json

text = '{"name": "yumesaku", "active": true, "tags": ["json", "format"]}'

data = json.loads(text)
print(json.dumps(data, ensure_ascii=False, indent=2))

実行すると、次のように出ます。

{
  "name": "yumesaku",
  "active": true,
  "tags": [
    "json",
    "format"
  ]
}

Python の json モジュールは、壊れた JSON を読んだときに投げるjson.JSONDecodeError が、読めなかった位置を行番号 (lineno) と列番号 (colno) として持っています。この道具の「行・列を自前で出す」考え方と同じです。下の出力は Python 3.13 以降 (手元では 3.14.7 で確認) のもので、3.11・3.12 では文言が Expecting property name enclosed in double quotes に変わります。

import json

try:
    json.loads('{"a": 1,}')
except json.JSONDecodeError as e:
    print(e.lineno, e.colno, e.msg)

1 8 Illegal trailing comma before end of object

JavaScript の例

const text = `{"name":"yumesaku","active":true,"tags":["json","format"]}`;

const data = JSON.parse(text);
console.log(JSON.stringify(data, null, 2));

実行すると、次のように出ます。ブラウザと Node.js のどちらでも動きます。

{
  "name": "yumesaku",
  "active": true,
  "tags": [
    "json",
    "format"
  ]
}

API を呼んで JSON を受け取るところまで含めて学びたい人は、下の関係する道具とレッスンに並べた JavaScript の非同期処理のコース (全 19 レッスン・380 分、2026-⁠10-⁠26 時点で本番を確認) を見てください。