JSON 整形ツールの使い方
- 「JSON を入力」欄に JSON を貼り付けます。試すときは「サンプルを読み込む」を押してください。
- 「整形」とインデント(スペース 2・スペース 4・タブ)を選ぶか、「圧縮」で空白と改行を取り除きます。
- 「キー名で並べ替え」をオンにすると、オブジェクトのキーがアルファベット順になり、2 つの JSON を比較しやすくなります。
- 「結果をコピー」または「.json をダウンロード」で結果を保存します。エラーが出たら表示された行を直すと、自動で再チェックされます。
よくある JSON の構文エラー
JSON(RFC 8259)は JavaScript のオブジェクトより厳密です。よくあるのは、最後の要素の後のカンマ({"a": 1,})、シングルクォートで囲んだ文字列、クォートのないキー({name: "x"})、コメント、そして NaN や undefined といった JSON では使えない値です。
ブラウザの JSON.parse のエラーメッセージは「Unexpected token } in JSON at position 42」のような英語で、Safari では位置すら表示されないことがあります。このツールは独自の厳密なチェックを行うので、どのブラウザでも行と文字位置、原因を日本語で確認でき、該当箇所に ^ 印を付けて表示します。
整形と圧縮の使い分け
整形(Pretty Print)は改行とインデントを入れて構造を読みやすくします。JavaScript や TypeScript のプロジェクトではスペース 2 が一般的で、Python の json.dumps(indent=4) に合わせるならスペース 4 を選びます。
圧縮(Minify)は不要な空白と改行をすべて取り除き、通信量や保存サイズを減らします。整形済みの JSON なら 2〜4 割ほど小さくなるのが普通です。結果の上に変換前後のサイズを表示します。
キーの並べ替えで差分を見やすく
JSON のオブジェクトのキーには順番の意味がありませんが、API やライブラリによって出力順が変わるため、そのまま比較すると差分だらけになります。両方を「キー名で並べ替え」をオンにして整形し、テキスト比較ツールにかけると本当の違いだけが見えます。配列の順番は意味があるので変更しません。
大きな数値と日本語の扱い
JavaScript の数値は 64 ビット浮動小数点数のため、9007199254740991(2 の 53 乗 − 1)を超える整数は精度が落ちます。長い ID が整形後に変わってしまう場合は、送り元で文字列として出力してもらうのが正解です。
日本語などの文字は UTF-8 のままそのまま表示し、\u3042 のようなエスケープに変換することはありません。もともと \u 形式で書かれている文字列は、整形すると読める日本語に戻ります。
よくある質問
貼り付けた JSON はサーバーに送信されますか?
いいえ。構文チェックも整形もブラウザ内で行うので、API のレスポンスや設定ファイルを貼り付けても外部に送られることはありません。端末に保存されるのは出力モードなどの設定だけです。
「最後の要素の後にカンマは付けられません」と出ます。
JavaScript では許される末尾のカンマ(trailing comma)も、JSON では文法エラーになります。閉じかっこ } や ] の直前のカンマを削除してください。
コメント付きの JSON(tsconfig.json など)も整形できますか?
コメントは JSON の仕様に含まれないため、エラーとして表示されます。// や /* */ のコメントを削除してから貼り付けるか、VS Code など JSONC に対応したエディターを使ってください。
整形と構文チェックの違いは何ですか?
構文チェック(バリデーション)は JSON として正しいかどうかを調べること、整形はインデントをそろえて読みやすくすることです。このツールは両方を同時に行い、エラーがあれば位置を、正しければ整形結果を表示します。
どのくらいのサイズまで扱えますか?
数 MB 程度なら問題なく処理できます。数十 MB を超えるファイルは、ブラウザ内で処理するため動作が重くなることがあります。
キーを並べ替えるとデータが変わりませんか?
変わりません。オブジェクト内のキーの順番だけが変わり、値や配列の並び順はそのまま保たれます。
最終更新: ソースコードを見る