JSON整形ツール:オンラインで見やすくチェック
このツールでは、貼り付けたJSONを整形して、インデントと色分けのついた見やすい形で確認できます。大きな数値、キーの順序、重複したキーは、書いたとおりのまま出力されます。JSONに誤りがあるときは、何が問題なのかと、その行と列が表示されます。
JSON整形の使い方
オンラインでJSONフォーマットを行う手順です。
- JSONを元のJSONの欄に貼り付けてください(「ここにJSONを貼り付けてください...」と表示されています)。貼り付けると、すぐに整形されます。入力しているときは、入力をやめて約300ミリ秒後に結果が更新されます。
- 結果は整形後のJSONで確認します。キー、文字列、数値、true / false、nullがそれぞれ別の色で表示されます。長い行は折り返さず横にスクロールするので、インデントが崩れません。
- JSONが正しいと、結果の下に「JSONは正しい形式です。」と表示されます。正しくない場合は、赤いJSONが正しくありませんの枠に理由が表示されます。
- 結果の見出しにあるコピーを選んでください。ボタンには一瞬「コピー完了」と表示され、貼り付けられるのは色のないプレーンテキストです。
- 下の消去を選ぶと、欄を空にして最初からやり直せます。
JSONインデントの設定:スペース2個、4個、タブ
タイトルの横にある歯車のアイコンを選ぶと、インデントが開きます。選べるのは、スペース2個(初期設定)、スペース4個、タブです。選んだ時点で整形結果がすぐに変わり、設定はコピーするテキストにも反映されます。
深くネストしたデータでは、スペース2個がいちばん行が短くなります。スペース4個やタブは、多くのプロジェクトのスタイルガイドに合います。
数値とキーの順序がそのまま残る理由
多くのJSONフォーマッタは、入力を一度オブジェクトに読み込んでから、もう一度書き出します。この往復で、データが気づかないうちに書き換わります。このツールは元のテキストを読み、JSONの規則に照らして確認し、トークンの間の空白だけを変えます。それ以外は1文字ずつそのままコピーします。
同じ入力 {"id":12345678901234567890,"price":1.0,"tag":"a","tag":"b","b":1,"2":3} を、このツールと、JSON.parse のあとに JSON.stringify を使った場合とで比べます。
- 大きな数値:このツールでは
12345678901234567890のままです。JSON.parseでは12345678901234567000に丸められます。 - 小数:
1.0は1.0のままです。もう一方では1になります。 - 重複したキー:2つの
"tag"がどちらも残ります。もう一方では最後の値だけが残ります。 - キーの順序:
"b"が"2"より前にあり、書いたとおりです。もう一方では"2"が先頭に移ります。
データベースのID、注文番号、APIのレスポンスからコピーした価格などで重要になります。整形後のテキストは元と同じデータで、読みやすくなっただけです。
JSONチェックと構文チェック:エラーメッセージの意味
このツールは厳密なJSON(RFC 8259)を検証します。JSON検証に通らないときは、JSONが正しくありませんの枠に、わかりやすい理由と、最初に見つかった問題の「N行目、M列目」が表示されます。よくある例です。
- 末尾のカンマ(例:
[1, 2,]):「閉じ括弧の直前にカンマがあります。JSONでは末尾のカンマは使えません。」 - 単一引用符(例:
{'name': 'Ana'}):JSONでは二重引用符を使います。該当の位置が示されます。 - コメント(例:
// note):「JSONにコメントは書けません。」 - 引用符のないプロパティ名(例:
{name: "Ana"}):ここには二重引用符で囲んだプロパティ名が必要です。 - カンマの抜け(例:
"b": 2 "c": 3):カンマか閉じ括弧が必要です。 - 先頭のゼロや
1.(例:01):JSONの数値として正しくありません。 NaN、undefinedなどの語:引用符なしで書けるのは true、false、null だけです。- JSONのあとの文字(例:
{"a": 1}}):終わりの後に余分な文字があります。 - 文字列の中の改行:
\nのようなエスケープで書いてください。
同じ枠で、閉じていない文字列、使えないバックスラッシュのエスケープ、末尾で開いたままの括弧(「文章が途中で終わっています」)も知らせます。Webページやチャットから貼り付けた改行なしスペースはU+00A0と表示されるので、見つけて削除できます。ファイル先頭のバイトオーダーマークは無視されます。
複数行の例です。{"a": 1,、"b": 2、"c": 3} では、2行目の終わりにカンマがありません。ツールは「3行目、2列目」と報告します。これは "c" の始まりの引用符で、その前にカンマがあるはずの位置です。
制限と、このツールにできないこと
- 5,000,000文字、ネスト1000階層まで扱えます。整形そのものは一瞬ですが、数メガバイトの結果を表示するには数秒かかることがあります。
- 800,000文字を超えると、結果は色なしで表示されます。コピーはそのまま使えます。
- 厳密なJSONのみです。コメント、末尾のカンマ、単一引用符は、受け入れたり黙って修正したりせず、指摘します。
- 圧縮、キーの並べ替え、YAMLやCSVなどへの変換はできません。整形と検証だけを行います。
- JSONはブラウザ上で整形されます。アップロードも保存もされません。
よくある質問
JSONをオンラインで整形するには?
JSONを「元のJSON」の欄に貼り付けてください。貼り付けるとすぐに、入力しているときは入力をやめて約300ミリ秒後に整形され、インデントされた結果が下の「整形後のJSON」に表示されます。「コピー」を選ぶと持ち出せます。整形はブラウザの中で行われるため、JSONがアップロードされることはありません。
JSONのインデントをスペース4個やタブにするには?
タイトルの横にある歯車のアイコンを選んで「インデント」メニューを開き、スペース2個、スペース4個、「タブ」のどれかを選びます。初期設定はスペース2個で、ほかを選ぶと結果はすぐに変わります。
JSONが正しいかどうかを検証するには?
貼り付けるだけです。正しい文書は整形され、結果の下に「JSONは正しい形式です。」と表示されます。正しくない場合は、赤い「JSONが正しくありません」の枠に、わかりやすい理由と、問題のある行と列が表示されます。
JSONで末尾のカンマのエラーが出るのはなぜですか?
JSONでは、オブジェクトや配列の最後の要素のあとにカンマを置けません。たとえば [1, 2,] がそうです。ツールは余分なカンマのあとにある閉じ括弧を指します。カンマを削除すれば整形できます。
JSONにコメントを書けますか?
いいえ。厳密なJSON(RFC 8259)にはコメントの構文がないので、設定ファイルによっては許容されていても、// や /* */ はエラーになります。ツールは正確な行と列で「JSONにコメントは書けません。」と知らせるので、コメントを取り除いてください。
整形すると数値やキーの順序は変わりますか?
いいえ。ツールは元のテキストを確認し、トークンの間の空白だけを書き換えます。数値、文字列、キーの順序、重複したキーはそのままコピーされるので、12345678901234567890 は丸められず、1.0 は 1.0 のままです。JSON.parse のあとに JSON.stringify を使うと、これらはすべて変わります。
大きなJSONファイルも整形できますか?
はい。5,000,000文字、ネスト1000階層まで扱えます。整形そのものは一瞬ですが、数メガバイトの結果の表示には数秒かかることがあります。800,000文字を超えると、速さを保つために構文の色分けなしで表示されます。「コピー」は引き続き使えます。
JSONはどこかにアップロードされますか?
いいえ。JSONはすべてお使いの端末の中で整形され、アップロードも保存もされません。
JSONフォーマッタ、JSONバリデーターの違いは何ですか?
フォーマッタは、JSONを読みやすくするために改行とインデントを加えます。バリデーターは、テキストが正しいJSONかどうかを確認します。このツールは2つを1回の操作で行います。厳密に検証し、JSONが正しければ整形します。
おすすめ
-
Amazonベーシック 6in1 USB-CハブノートPCに足りないポートを増やして、APIのレスポンスを2台目の画面でコードの横に表示できます。
-
ASUS ZenScreen 15.6型 モバイルモニター整形したJSONを2台目の画面に、エディタやドキュメントを1台目に置いて見比べられます。
-
ロジクール MX KEYS S ワイヤレスキーボード長いJSONを読みながら設定ミスを探すとき、手元をしっかり確認できる打ちやすいワイヤレスキーボードです。
無料でツールを続ける支えになります。✨
画像はイメージです。 Amazonのアソシエイトとして、Capsule Toolsは適格販売により収入を得ています。