入力

出力

JSONフォーマッターとは?

JSON(JavaScript Object Notation)は、今日のWebで最も広く使われているデータ形式です。APIが返し、設定ファイルで使用し、データベースに保存されます。JSON仕様は最小限に保たれており、機械には適していますが、実際にデータを読む必要があるときには不便です。JSONフォーマッターは、生のJSONやミニファイされたJSONにインデントと改行を追加して、構造を明確に表示します。

このツールは完全にブラウザ内で動作します。JSONはJSON.stringify()で2スペースのインデントを使って処理され、結果が出力パネルに表示されます。サーバーには何も送信されないため、本番データ、トークン、その他マシンから送信したくないものにも安全に使用できます。

JSONフォーマットの例

フォーマッターの動作例を示します。ミニファイまたは圧縮されたJSONは読みにくいですが、フォーマットすると構造が一目でわかります。

例1:加入者レコード

ミニファイされた入力(1行):

入力

フォーマットされた出力:

出力

例2:通話レコード

ミニファイされた入力:

入力

フォーマットされた出力:

出力

上のサンプルボタンをクリックして、準備済みの例(モバイルプランデータ)をエディターに読み込み、フォーマッターの動作を確認してください。

このツールの使い方

1

貼り付けまたはアップロード

JSONをコピーして左のエディターに貼り付けます。アップロードをクリックして、コンピューターから.jsonまたは.txtファイルを読み込むこともできます。サンプルボタンでテスト用のサンプルデータを読み込めます。

2

出力を確認

右のパネルは入力に応じて自動的に更新されます。有効なJSONはRFC 8259に従って適切にインデントされます。構文エラー(括弧の欠落、末尾のカンマ、引用符のないキー)がある場合は、代わりにエラーメッセージが表示されます。

3

コピー、ダウンロード、またはミニファイ

コピーで結果をクリップボードに、ダウンロードでファイルとして保存、ミニファイで空白をすべて削除してコンパクトな1行バージョンを取得できます。

フォーマッターの仕組み

両方のエディターはAce Editorを使用しており、構文ハイライト、行番号、JSON固有のエラーマーカーを提供します。入力パネルにJSONを貼り付けたり入力したりすると、ツールは300ms待機して(入力途中のパースを避けるため)、JSON.parse()を実行します。パースが成功するとJSON.stringify(data, null, 2)を呼び出して結果を表示します。パースが失敗すると、出力にエラーが表示されます。

注意:JSONはコメントをサポートしていません。これは仕様で定義されており、このツールの制限ではありません。VS Codeのsettings.jsonなどのファイルはJSONC(コメント付きJSON)を使用しており、別の形式です。コメントがあるファイルは、フォーマット前に削除する必要があります。

JSONフォーマットが役立つ場面

多くの開発者はAPIレスポンスを読むときにフォーマッターが必要になります。Postmancurlでリクエストを送ると、レスポンスは1行の圧縮された形式で返ってきます。ここに貼り付けると、ネストされたオブジェクトと配列がすぐに表示されます。大きなレスポンスから特定の値を抽出するには、コマンドラインのjqが便利です。

設定ファイルも一般的なケースです。インデントが不揃いの<code>package.json</code>や<code>tsconfig.json</code>はプルリクエストでレビューしにくいです。ここでフォーマットすると、貼り戻せる一貫したバージョンが得られます。2つの設定ファイルを結合する必要がある場合は、専用のJSONマージツールがあります。

<a href="https://www.mongodb.com/docs/manual/reference/mongodb-extended-json/" target="_blank" rel="noopener">MongoDB</a>、Firestore、CouchDBからのデータベースエクスポートは、通常フォーマットされていない大きなJSONブロックです。ここで処理すると、インポートスクリプトやクエリを書く前にドキュメント構造を理解するのに役立ちます。スプレッドシート形式が必要な場合は、JSONをCSVにで変換できます。

チームメンバーとJSONを共有する前にも便利です。SlackメッセージやJiraチケットのフォーマットされたJSONは、生のミニファイされた文字列よりはるかに読みやすくなります。まずJSONバリデーターで実行すると、他の人が見る前に問題を検出できます。

よくある質問

データはプライベートですか?

はい。フォーマットはブラウザ内のJavaScriptで行われます。データはサーバーに送信されません。ツール使用中にブラウザのネットワークタブを開いて確認できます。

サイズ制限はありますか?

ツール自体に厳密な制限はありません。ブラウザの利用可能なメモリに依存します。ChromeとFirefoxでは、10〜15MBまでのJSONファイルは通常問題なく動作します。非常に大きなファイル(数百MB)の場合は、jqなどのコマンドラインツールの方が実用的です。

ミニファイは何をしますか?

フォーマットされた出力からすべての空白(改行、スペース、インデント)を削除し、可能な限り小さなJSONバージョンを生成します。URLにJSONを埋め込む、データベースフィールドに保存する、ネットワーク経由のペイロードサイズを減らすのに便利です。専用のJSONミニファイアーページもあります。

出力に「無効なJSON」と表示されるのはなぜですか?

入力に構文エラーがあります。一般的な原因は、最後の要素の後の末尾カンマ、単一引用符の代わりに二重引用符、引用符のないプロパティ名、または括弧の不一致です。JSON仕様はこれらすべてに厳格です。

スキーマに対してJSONを検証できますか?

このツールは構文(JSONが正しく形成されているか)を検証し、構造は検証しません。スキーマ検証には、JSONスキーマジェネレーターでサンプルデータからスキーマを生成するか、JSONバリデーターでより詳細なチェックを行ってください。

関連ツール

JSONの詳細は、MDNのJSONガイドでパースとストリング化を解説しています。正式な標準はRFC 8259です。json.orgjqも参照してください。