ツール
ガイド

JSON フォーマッタ・バリデータ

JSON

JSON の整形・検証・圧縮を行います。行と列でエラー位置を正確に表示し、構文ハイライトも備えます。

100% クライアントサイド バックエンドなし

リモート URL の取得は行いません。JSON を直接貼り付けてください。

入力
出力
左に JSON を貼り付けると、ここに整形結果が表示されます。
このページの内容

JSON フォーマッターとは?#

JSON フォーマッターは、1 行に詰め込まれた JSON(サーバーがログに出力する 1 行の JSON や、バンドラーが吐き出す minified な JSON)を受け取り、人が読めるようにインデントを揃えて書き直します。地味な作業に聞こえますが、リクエストが失敗したとき、設定ファイルのタイプミスを探すとき、同じに見える 2 つのペイロードの挙動がなぜか違うとき——そうした場面で真っ先に手にするツールは、たいていこれです。

このページは、関連する 3 つの処理を 1 箇所で行います。プリティプリント(整形)(インデントと改行を追加)、検証(そのテキストが正しい JSON かどうかを判定)、そして圧縮(minify)(最小のペイロードにするため、空白をすべて取り除く)です。検証に失敗したとき、ステータスバーは単に「エラー」と言うのではなく、正確な行と列を報告します。これが「5 秒で直る」と「20 分ほど原因を睨む」の分かれ目になります。

使い方#

  1. 左側の入力ペインに JSON を貼り付けます。動作を確認したいだけなら、サンプルをクリックして小さな例を読み込んでも構いません。
  2. ツールバーでインデントスタイルを選びます。「2 スペース」「4 スペース」「タブ」のいずれか。2 スペースが最も一般的な慣習です。すでにタブを使っているエディタに貼るならタブが便利です。
  3. さらに何をしたいか選びます。
    • 整形 — 選んだインデントでプリティプリントします。
    • 圧縮 — スペースなしの 1 行に折りたたみます。リクエストボディに貼る前に最適です。
    • 検証 — テキストを変更せずに構文だけをチェックします。はい/いいえの答えだけが欲しいときに便利です。
  4. オブジェクトのプロパティをアルファベット順で出力したい場合は、キーを並べ替えにチェックを入れます。異なるバージョンの API レスポンスを比較するときに驚くほど役立ちます。キーが並び替えられていれば、残る違いは本当に意味のある違いだけになります。
  5. 最後の項目の後にカンマを置く、人間向けの緩い記法(末尾のカンマを許可)を使いたい場合はチェックを入れます。ただし厳密なパーサーはこれを拒否するので、ローカルで読む用途でのみ有効にしてください。
  6. 出力ペインで結果を読みます。下のステータスバーは「JSON は有効です」か、正確なエラー位置(行:列: メッセージ)を報告します。コピーで出力を取り出せます。

主な特徴#

  • 厳密なネイティブパーサー。 ブラウザ自身の JSON 実装で構築されているため、ここで通るものは実行時にも通ります。独自の方言も、予期せぬ挙動もありません。
  • 正確なエラー位置。 末尾カンマ、クォートされていないキー、閉じ括弧の欠落——いずれも総称的な「parse error」ではなく、行と列で報告されます。
  • 3 種類のインデント。 2 スペース、4 スペース、タブ。
  • キー並べ替え・末尾カンマを切替可能。 貼り直しなしに、処理ごとに切り替えられます。
  • 100% クライアントサイド。 貼り付けたテキストはブラウザ内のページで処理されます。アップロードされることはありません——そもそもアップロード先のバックエンドが存在しません。
  • リアルタイムの文字数カウント。 両ペインにサイズが表示されるため、ペイロードのバイト数を削りたいときに役立ちます。

実例#

設定エンドポイントが次のような minified な塊を返し、名前の間違ったキーを見つけなければならない場面を想像してください。

入力(minified、1 行):

{"server":"api.example.com","port":443,"retry":{"count":3,"backoffMs":[100,400,1600]},"tags":["prod","primary"]}

2 スペースのインデントとキーを並べ替えをオンにして整形をクリックします:

{
  "port": 443,
  "retry": {
    "backoffMs": [
      100,
      400,
      1600
    ],
    "count": 3
  },
  "server": "api.example.com",
  "tags": [
    "prod",
    "primary"
  ]
}

キーが並び替えられたことで、backoffMscount の隣に並び、1 行版では見えなかった指数的なパターン(100、400、1600)がすぐに見て取れます。tags は依然として ["prod","primary"] のままである点に注意してください——キー並べ替えが対象とするのはオブジェクトのプロパティだけで、配列の要素には決して触れません。だからこそ、あなたが入れた順序がそのまま戻ってきます。

よくある質問#

データはアップロードされますか?#

いいえ。解析はページ内でブラウザの組み込み JSON API が行います。サーバーエンドポイントもネットワークリクエストもありません——入力はお使いの端末に留まります。

ステータスバーが「JSON が無効です」と表示しますが、見た目は問題なさそうです。どうすれば?#

報告された行と列を確認してください。最もよくある原因は次の 4 つです。閉じ }] の前の末尾カンマ、文字列を囲むシングルクォート(JSON ではダブルクォートが必須)、クォートされていないオブジェクトキー、そして別のエディタから貼り付けられたリテラルのタブや制御文字です。列番号がまさにその原因を指し示します。

「キーを並べ替え」は実際には何をするのですか?#

すべてのオブジェクトのプロパティをアルファベット順(ASCII 順、大文字小文字を区別)で再出力します。配列は元の順序のままです。配列の順序には意味があるため、キー並べ替えが配列要素を並べ替えることはありません。

大きなファイルも扱えますか?#

はい、ブラウザのメモリ上限までは扱えます。数メガバイトを超えるファイルでは、整形に少し時間がかかります。ステータスバーに文字数が表示されるので、サイズの見当がつきます。このページはストリーミングを行わないため、数百 MB 単位の非常に大きな入力ではタブが重くなります。