JSONツリービューアー

このオンラインJSONツリービューアーで、あらゆるJSONを折りたたみ可能で型別に色分けされたツリーに変換し、深くネストしたデータを素早く辿れます。

JSONはツリーを構築するためにブラウザ内でローカルに解析され、サーバーへ何もアップロードされません。

開発・運営:Udit Agarwal

きれいにインデントされた出力が必要ですか?JSON整形ツールをお試しください。

JSON ツリービューア について

このオンラインJSONツリービューアーは、生のJSONを折りたたみ可能で色分けされたツリーに変換し、密なテキストをスクロールせずに深くネストしたオブジェクトや配列を探索できるようにします。左側にAPIレスポンス・設定ファイル・ログの中身を貼り付けると、右側に即座にツリーが描画され、各値には型が付き、折りたたんだ配列やオブジェクトには項目数やキー数が表示されます。エンドポイントをデバッグする開発者、フィクスチャを確認するQAエンジニア、見慣れないJSON構造を理解しようとするすべての人のための、手軽なJSONビューアーとして機能します。不正なJSONは行と列とともに示されるため、構文エラーを素早く修正できます。ブラウザ内でローカルに動作するため、大きなドキュメントや機密性の高いドキュメントもご自身の端末で解析され、データが端末から外に出ることはありません。ネストしたJSONを探索し、値の形を辿り、複雑な中身を一目で把握するのにお使いください。

機能

  • JSONを折りたたみ・展開可能なノードのツリーとして描画
  • 値を型ごと(文字列・数値・真偽値・null・オブジェクト・配列)に色分け
  • 折りたたんだ配列やオブジェクトに項目数とキー数を表示
  • 不要な枝を折りたたみ、大きなドキュメントを扱いやすく保つ
  • 大きく深くネストしたJSON構造にも対応
  • 不正なJSONを正確な行と列とともに報告
  • すべてをブラウザ内でローカルに解析し、アップロードなし
  • 元のJSONを決して変更しない読み取り専用ビュー

JSON ツリービューア の使い方

  1. 左側の「入力JSON」ボックスにJSONを貼り付けるか入力します。
  2. 右側のツリーパネルに、型付きで色分けされたツリーとして描画されるのを確認します。
  3. 任意のオブジェクトまたは配列ノードをクリックして、その枝を展開または折りたたみます。
  4. JSONが不正な場合は、報告された行と列を読み、構文を修正します。

例

入力

{"user":{"id":7,"roles":["admin","editor"],"active":true}}

出力

object {1}
 └─ user object {3}
     ├─ id: 7
     ├─ roles array [2]
     │   ├─ 0: "admin"
     │   └─ 1: "editor"
     └─ active: true

オブジェクトは各値に型が付いた折りたたみ可能なツリーとして描画されます。

よくあるエラーとトラブルシューティング

  • ツリーが描画されず、行と列を指すエラーが出る。 — JSONが不正です。報告された行と列でカンマ・括弧・引用符の不足を確認し、修正してください。
  • オブジェクトや配列の最後の項目の後ろの末尾カンマが拒否される。 — 標準のJSONは末尾のカンマを許可しません。最後の要素の後のカンマを削除してください。
  • シングルクォートで囲まれたキーや文字列が解析に失敗する。 — JSONはキーと文字列値をダブルクォートで囲む必要があります。シングルクォートをダブルクォートに置き換えてください。
  • 非常に大きなドキュメントが重い、または見渡しにくい。 — 不要な枝を折りたたみ、関連する部分のツリーだけを開いたままにしてください。

よくある質問

JSONツリービューアーとは何ですか。
JSONを解析し、折りたたみ可能な型付きのツリーとして表示するオンラインツールで、生のテキストを読まずにネストしたオブジェクトや配列を辿れます。各値は型ごとに色分けされます。
JSONツリービューアーで深くネストしたJSONを探索するには。
左側にJSONを貼り付け、ツリーパネルで任意のオブジェクトまたは配列ノードをクリックして展開または折りたたみます。折りたたんだ枝には項目数やキー数が表示されるため、必要な部分だけを掘り下げられます。
JSONツリービューアーは大きく深くネストしたJSONを扱えますか。
はい。大きく深くネストしたドキュメントも描画でき、不要な枝を折りたたんでビューを高速で扱いやすく保てます。
JSONツリービューアーはJSONを変更したり保存したりしますか。
いいえ。ビューアーは解析した構造を表示するだけで、元のJSONが変更されたり保存されたりすることはありません。
JSONツリービューアーでJSONが不正な場合はどうなりますか。
ビューアーはエラーをテキスト中の正確な行と列とともに報告するため、構文の問題を素早く見つけて修正できます。
JSONツリービューアーを使うとデータはどこかに送信されますか。
いいえ。JSONはブラウザ内でローカルに解析され、端末から外に出ることはないため、機密性の高い中身もご自身の端末に留まります。

関連ツール

  • JSON ビューア — テキストと折りたたみツリーのビューア。展開/折りたたみとノードパスに対応。
  • JSON フォーマッター — JSONの整形・圧縮・検証を行い、エラー箇所も表示します。
  • JSON から TypeScript — サンプルJSONから TypeScript のインターフェースを生成します。
  • JSON から CSV — フラットなJSONオブジェクトの配列をCSVに変換します。
  • JSON からコード — JSONから Go、Rust、Python、Java、Kotlin、C#、TypeScript の型を生成します。
  • YAML ↔ JSON — YAMLをJSONに、またその逆に変換します。
  • XML フォーマッター — XMLの整形・圧縮・検証を行い、XML ↔ JSON を変換します。

JSONの他のツール

  • JSON ビューア — テキストと折りたたみツリーのビューア。展開/折りたたみとノードパスに対応。
  • JSON から TypeScript — サンプルJSONから TypeScript のインターフェースを生成します。
  • JSON から CSV — フラットなJSONオブジェクトの配列をCSVに変換します。
  • JSON エスケープ / アンエスケープ — テキストをJSON文字列にエスケープ、またはJSON文字列をプレーンテキストに戻します。
  • JSON からコード — JSONから Go、Rust、Python、Java、Kotlin、C#、TypeScript の型を生成します。
  • JSON Diff — 2つのJSONを比較し、追加・削除・変更を構造的な差分で表示します。
  • JSON Schema 生成・検証ツール — JSONサンプルからスキーマを生成し、ドキュメントを検証します。
  • JSON Flatten / Unflatten — ネストしたJSONをドット記法のキーにフラット化し、元に戻す。
  • JSON to Zod — JSONサンプルからZodスキーマを生成。
  • JSON to Pydantic — JSONサンプルからPydantic v2モデルを生成。
  • JSONPath 評価ツール — JSONPath式をJSONに対して評価し、マッチをライブ表示。
  • JSON to TOON — JSONとTOONを相互変換し、LLMのプロンプトトークンを節約。

JSONのツールをすべて見る (29) · すべてのツール