JSON Diff:JSON オブジェクトを比較

2 つの JSON ドキュメントを貼り付けると、何が変わったかが正確にわかります。すべての差分を $.users[2].email のようなパスで一覧表示し、書式やキーの順序で誤検出することはありません。

ブラウザ内で動作登録不要アップロードなし

キーの順序は常に無視されます。

JSON Diffの使い方

  1. 左に元の JSON、右に変更後の JSON を貼り付けるか、2 つのファイルを開きます。
  2. 構文エラーは各欄の下に行と列付きで表示されるので、すぐに修正できます。
  3. 変更されたパスの表を確認します。各行に、値が追加・削除・変更のどれか、そして旧値と新値が表示されます。
  4. タグや権限のように、リストが集合として扱われる場合は配列の順序を無視にチェックを入れます。
  5. 左右比較表示までスクロールして文脈の中で変更を確認するか、変更一覧を JSON としてコピーします。

構造的な JSON Diff がテキスト Diff より優れている理由

単純なテキスト Diff は文字と行を比較するため、同じデータを持つ 2 つの JSON ファイルでも、一方が minify されていたり、インデントが異なったり、キーの順序が違ったりするだけでまったく別物に見えてしまいます。このツールはまず両方のドキュメントを解析し、データを比較します。オブジェクトは順序に関係なくキーごとに比較され、数値、文字列、真偽値、null は値で比較されます。報告されるのは本当の変更だけです。

変更の報告方法

各差分には JSONPath 形式の位置($.owner.email や $.items[3].price など)と、次の 3 種類のいずれかが付きます。

  • 追加:そのキーや配列要素は変更後の JSON にのみ存在します。
  • 削除:元の JSON にのみ存在します。
  • 変更:両方に存在しますが値が異なります。文字列が数値になるような型の変更も含みます。

配列は最長共通部分列アルゴリズムで位置合わせされるため、リストの先頭に要素を 1 つ挿入しても、後続のすべての要素が変更扱いになるのではなく、1 件の追加として報告されます。

配列の順序を無視する

多くの API は、ロール、タグ、ID など、順序に意味のないリストを返します。配列の順序を無視をオンにすると、配列はコレクションとして比較されます。要素が追加または削除とみなされるのは、反対側に等しい要素がない場合だけです。左右比較表示でも配列要素が並べ替えられ、等しいリストが揃って表示されます。

よくある用途

ステージングと本番の API レスポンスの比較、マイグレーションで設定ファイルの何が変わったかの確認、2 つの package.json や tsconfig ファイルの差分のレビュー、スナップショットテストのデバッグに使えます。

よくある質問

JSON の比較でキーの順序は関係ありますか?
いいえ。JSON オブジェクトには順序がないため、{"a":1,"b":2} と {"b":2,"a":1} は等しいと報告されます。配列は順序を持つため、デフォルトでは配列の順序は区別されますが、配列の順序を無視でオフにできます。
JSON はサーバーにアップロードされますか?
いいえ。両方のドキュメントはブラウザ内で解析・比較されます。ネットワーク経由では何も送信されないため、トークンや顧客データを含む API レスポンスにも安心して使えます。
$.users[2].email のようなパスはどういう意味ですか?
$ はドキュメントのルート、.users はキー、[2] は配列の 3 番目の要素です(インデックスは 0 から始まります)。スペースや特殊文字を含むキーは $["first name"] のように角括弧で表記されます。
1 と 1.0 は等しいですか?
はい。どちらも同じ数値として解析されるため、差分としては報告されません。1 と "1" のような数値と文字列は異なるため、変更として報告されます。
コメントや末尾カンマを含む JSON も比較できますか?
標準の JSON ではこれらは許可されていないため、そのような入力は正確な行と列とともにエラー表示されます。コメントやカンマを削除するか、先に JSON フォーマッターでドキュメントを整えてください。

関連ツール