ツールさん

How to

JSON フォーマッターの使い方

JSON を貼り付けるだけで整形・圧縮・検証ができる開発補助ツールです。エラー位置の把握やコピーしやすい表示を重視します。JSON を入力して整形または検証し、結果をコピーする流れで使います。

JSON フォーマッター のサムネイル画像JSON フォーマッター のサムネイル画像
手順
2 ステップ
案内
画像つき解説
内容
注意点と FAQ

Use Cases

こんな時に使います

  • API レスポンスを確認したい
  • 壊れた JSON のエラー箇所を見たい
  • 整形済み JSON を資料へ貼りたい
  • 設定ファイルの JSON を整形して可読性を上げたい
  • JSON の構造を確認しやすい形に整えたい
  • エラー箇所を特定して修正前に原因を確認したい

Capabilities

このツールでできること

  • 整形と圧縮を切り替え
  • 構文エラーの表示
  • コピーしやすい出力
  • 1 クリックで整形と圧縮を切り替え
  • 不正な JSON のエラー箇所を行単位で表示
  • 整形結果をそのままクリップボードへコピー

Steps

手順

画面を見ながら進められるように、操作の順番と確認ポイントをまとめています。

STEP 1

JSON を貼り付ける

左側の JSON 入力欄へ JSON を貼り付けます。整形したい内容や、正しいか確認したい内容をそのまま入れます。

JSON フォーマッターツールの入力欄だけを切り出したキャプチャ。赤枠で JSON 入力欄と操作ボタンを示しているJSON フォーマッターツールの入力欄だけを切り出した SP 向けキャプチャ。JSON 入力欄と操作ボタンを示している

確認ポイント

  • 入力欄に JSON 全体が入っていること
  • 整形、圧縮、検証の操作ボタンが見えていること

この画面で使う操作

01
JSON の入力

API レスポンスや設定値をそのまま貼り付けて編集できます。

JSON フォーマッターの入力欄だけを切り出した画面JSON フォーマッターの入力欄だけを切り出した SP 画面
02
整形

読みやすいインデント付きの JSON に整えて確認できます。

JSON フォーマッターの整形ボタンを切り出した画面JSON フォーマッターの整形ボタンを切り出した SP 画面
03
圧縮

空白や改行を詰めた JSON に変換して、埋め込みや送信用に使えます。

JSON フォーマッターの圧縮ボタンを切り出した画面JSON フォーマッターの圧縮ボタンを切り出した SP 画面
04
検証

JSON の構文が正しいか、その場で確認できます。

JSON フォーマッターの検証ボタンと入力情報を切り出した画面JSON フォーマッターの検証ボタンと入力情報を切り出した SP 画面

STEP 2

整形して結果をコピーする

整形を押して結果欄に表示された内容を確認します。問題なければ「結果をコピー」を押して利用します。

JSON フォーマッターツールの結果欄だけを切り出したキャプチャ。赤枠で整形結果と結果をコピーボタンを示しているJSON フォーマッターツールの結果欄だけを切り出した SP 向けキャプチャ。整形結果と結果をコピーボタンを示している

確認ポイント

  • 結果欄に整形済み JSON が表示されること
  • 検証状態が正常になっていること
  • 結果をコピーボタンが押せること

この画面で使う操作

01
結果の確認

整形または圧縮した JSON を結果欄で確認できます。

JSON フォーマッターの結果欄だけを切り出した画面JSON フォーマッターの結果欄だけを切り出した SP 画面
02
結果をコピー

整えた JSON をそのままコピーして、他の作業へ渡せます。

JSON フォーマッターの結果をコピーボタンだけを切り出した画面JSON フォーマッターの結果をコピーボタンだけを切り出した SP 画面

Notes

使う時の注意

使う前に確認しておくと迷いにくいポイントを、理由つきでまとめています。

確認すること

貼り付ける前に JSON 全体を確認する

途中で切れた JSON では正しい整形結果になりません。レスポンスや設定値を丸ごと貼り付けると、エラー箇所も見つけやすくなります。

確認すること

整形と圧縮を用途で使い分ける

確認用なら整形、送信用や埋め込み用なら圧縮が向いています。目的に応じて出力を切り替えると作業が早くなります。

確認すること

JSON 以外の形式は整形できない

このツールは標準の JSON に特化しています。YAML・XML・JSON5 など他の形式は扱えません。変換したい形式が JSON かどうかを先に確認してください。

FAQ

JSON フォーマッター に関する質問

使う前に判断しやすい質問を先に整理します。

大きな JSON も扱えますか?

ブラウザで扱える範囲なら使えます。非常に大きい JSON では、整形や検証に時間がかかったり、画面の反応が重くなることがあります。

JSON 以外も整形できますか?

このページでは JSON の整形、圧縮、検証のみ行えます。YAML や XML は扱えません。

整形時のインデントは変更できますか?

現時点では標準のインデント設定で整形します。インデント幅の変更には対応していません。

コメント付き JSON(JSON5 や JSONC)も扱えますか?

このページは標準の JSON のみに対応しています。JSON5 や JSONC(コメント付き)は扱えません。

出力をそのままコピーして使えますか?

はい。整形・圧縮後の結果をワンクリックでコピーできます。

どのくらいの JSON サイズまで扱えますか?

ブラウザで扱える範囲での処理になります。非常に大きい JSON では動作が重くなることがあります。

次に見る使い方

関連する使い方

関連する使い方を続けて見られるように、次に確認しやすい導線をまとめています。