JSON整形ツール
上の入力欄にJSONを貼り付けると、このJSON整形・構文チェックツールが入力と同時に内容を検証します。正しいJSONは選んだインデントで見やすく整形するか、1行に圧縮できます。誤りがあれば、行と列、問題箇所をハイライトした抜粋、そしてよくあるミスならワンクリックの修正ボタンが表示されます。処理はすべてブラウザ内で行われるため、APIレスポンスや設定ファイル、エクスポートしたデータがお使いのコンピューターの外に送られることはありません。
JSON整形ツールでできること
- JSONの整形：スペース2つ、スペース4つ、またはタブでインデントします。「キーをソート」にチェックを入れない限り、元のキーの順序はそのまま保たれます。
- JSONの圧縮（minify）：スペースと改行をすべて取り除きます。結果の下のサイズ表示で、何バイト減ったかを確認できます。
- JSONの構文チェック：現行のJSON標準であるRFC 8259に照らしてリアルタイムで検証します。ドキュメントが正しくなった時点で、ステータス行が緑色に変わります。
- よくあるエラーの自動修正：末尾のカンマ、シングルクォート、引用符のないキー、コメント、Python風の
True、None、NaN、.5や+1のような数値を直します。 - ファイルの読み込み：「ファイルを開く」ボタンを使うか、入力欄に
.jsonファイルをドロップします。結果はダウンロードすることも、入力欄に戻してもう一度処理することもできます。
エラーメッセージが赤い表示より大切な理由
多くのオンラインバリデーターは、どこかが間違っていることしか教えてくれません。ブラウザも大差はなく、ChromeのJSON.parseはUnexpected token } in JSON at position 148、Firefoxはexpected property name or '}'と表示するだけで、どちらも何行目を見ればよいかは示しません。このツールは独自のパーサーを持ち、すべてのトークンの開始位置を記録しています。解析が止まると、行と列、その行の抜粋と問題の文字を指すキャレット（^）、そして「2つのプロパティの間のカンマが抜けている可能性があります」のような分かりやすいヒントが表示されます。「エラー箇所へ移動」ボタンを押すと、入力欄のその位置へカーソルが直接移動します。
貼り付けられたドキュメントで特によく見かけるミスは次のとおりです。
| 入力 | 問題 | 正しいJSON |
|---|---|---|
{'name': 'Ada'} | シングルクォート | {"name": "Ada"} |
{name: "Ada"} | 引用符のないキー | {"name": "Ada"} |
[1, 2, 3,] | 末尾のカンマ | [1, 2, 3] |
{"a": 1 "b": 2} | カンマの抜け | {"a": 1, "b": 2} |
{"ok": True} | Pythonのリテラル | {"ok": true} |
{"x": 007} | 先頭のゼロ | {"x": 7} または {"x": "007"} |
// comment | コメント | JSONでは使用不可 |
「自動で修正」ボタンは、カンマの抜けと先頭のゼロ以外のすべてを直します。修正はあえて控えめにしてあります。間違った位置にカンマを入れるとデータの意味が変わってしまうため、抜けたカンマの位置を推測することはしません。また007は数値の7なのか、コードなのかを判断できません。こうした場合は、代わりに正確な位置を表示します。
大きな数値やキーの順序など、壊れやすいもの
多くの整形ツールは、JSON.parseで読み込んでからJSON.stringifyで書き出しています。この往復処理は、気づかないうちにデータを壊します。1234567890123456789のようなTwitterやSnowflakeのIDは、JavaScriptの数値の上限である2^53を超えるため、1234567890123456800になって戻ってきます。1.0という値は1に、1e3は1000に変わります。このJSON整形ツールは数値を浮動小数点数に変換しません。すべてのリテラルを書かれたとおりにコピーするので、出力は入力を解釈し直したものではなく、忠実に整形し直したものです。文字列内のエスケープシーケンスも同様で、"\u00e9"は"\u00e9"のまま残り、"é"には変換されません。
キーの順序も保たれます。JSONの仕様ではオブジェクトのメンバーに順序はないとされていますが、設定ファイルやテストフィクスチャ、コードレビューでは、順序が安定しているほうがずっと読みやすくなります。正規化した形にしたい場合、たとえば2つのAPIレスポンスを差分ツールで比較したいときは、「キーをソート」をオンにしてください。どちらのドキュメントも、すべての階層でプロパティがアルファベット順に並びます。
JSON整形とJSON圧縮の使い分け
整形したJSONは人が読むためのものです。APIレスポンスを確認するとき、package.jsonやtsconfig.json、OpenAPIのドキュメントを書くとき、また差分を1行に1つの変更として見たいリポジトリにフィクスチャを保存するときに使います。JavaScriptの世界ではスペース2つが慣例で、Pythonや.NETのプロジェクトではスペース4つがよく使われます。タブにすれば、読む人がそれぞれ好みの幅で表示できます。
圧縮したJSONは機械のためのものです。整形済みのドキュメントでは空白が20〜40%を占めることが多いため、取り除くと、ブラウザに送るペイロード、Redisやデータベースのカラムに保存する値、HTMLに埋め込むdata-*属性が小さくなります。gzip圧縮をかければその差は一部縮まりますが、それでも圧縮（minify）済みのJSONのほうがgzip後のサイズも小さくなります。結果の下のサイズ表示で、お手元のドキュメントでの正確な差を確認できます。
ターミナルやエディターでのJSON整形
繰り返し処理するファイルなら、どんなWebサイトよりもコマンドラインツールのほうが速く済みます。jq . file.jsonで整形、jq -c . file.jsonで圧縮ができ、python -m json.tool file.jsonはPythonがインストールされていればどこでも使えます。Visual Studio CodeではShift+Alt+FでJSONを整形でき、$schemaプロパティを追加するとスキーマに沿った検証も行われます。このページはそれ以外の場面のためのものです。ネットワークタブからコピーしたレスポンス、ログの1行、Wikiに載っている設定の断片、何もインストールできないマシンでの手早いチェックなどに使えます。
このサイトの関連ツールも紹介します。Base64エンコード・デコードツールでは、Base64urlでエンコードされたJSONであるJWTのペイロード部分をデコードできます。UNIXタイムスタンプ変換ツールは、多くのAPIレスポンスに含まれるcreatedAtの数値を読みやすい日時に変換し、UUIDデコーダーはデータ内の識別子のバージョンとタイムスタンプを表示します。その他のツールは開発者向けツールにまとめています。
よくある質問
JSONはサーバーにアップロードされますか？
いいえ。解析、整形、修正はすべてブラウザ内のJavaScriptで実行されます。ページの読み込みが終われば、ネットワークを切断してもツールは動作し続けます。内容が記録されたり保存されたりすることはありません。エディターではコメントが使えるのに、なぜこのバリデーターはエラーにするのですか？
コメントは、JSONの考案者であるDouglas Crockfordが、パーサーへの指示に使われるのを防ぐためにあえて仕様から外したものです。tsconfig.jsonや.vscode/settings.jsonのようなファイルは、厳密にはエディターが対応しているJSONの拡張形式、JSONCです。API、データベース、多くのプログラミング言語の厳格なパーサーはコメントを受け付けません。修正ボタンはコメントを取り除くので、結果はどこでも有効なJSONになります。
JSON Linesや複数のオブジェクトをまとめて整形できますか？
1つのJSONドキュメントに含められる値は1つだけです。カンマや改行で区切った複数のオブジェクトを貼り付けると、バリデーターは2つ目の値のところで止まります。全体を角括弧で囲んで配列にしてから整形してください。入力が1つのドキュメントのつもりだったのかを判断できないため、修正ボタンはこれを自動では行いません。扱えるサイズに上限はありますか？
決まった上限はありません。数メガバイトのドキュメントでも、ノートパソコンなら1秒もかからずに整形できます。ページの反応を保つため、約400 kBを超えるとシンタックスハイライトはオフになりますが、コピーとダウンロードはそのまま使えます。キーをソートするとデータは変わりますか？
いいえ。JSONのオブジェクトは定義上順序を持たないため（WikipediaのJSONの記事を参照）、パーサーはソート後のドキュメントと元のドキュメントを同じ値として読み込みます。配列の順序はデータの一部なので、並べ替えることはありません。JSONを文字列に埋め込むにはどうエスケープしますか？
まず圧縮し、次にすべてのバックスラッシュとダブルクォートをエスケープします。多くの言語にはそのための手段が用意されています。JavaScriptならJSON.stringify(JSON.stringify(obj))、Pythonならjson.dumps(json.dumps(obj))で、JSONテキストを含むJSON文字列が得られます。