DevToolBoxFREE
BlogAdvertise

JSONフォーマッター＆バリデーター：オンラインで整形・検証

12分by DevToolBox

JSONフォーマッターとJSONバリデーターツールは、API、設定ファイル、データ交換を扱うすべての開発者に不可欠です。可読性のためのJSON整形、構文エラーを検出するためのオンラインJSON検証、デバッグのためのJSON美化印刷など、この包括的なガイドですべてをカバーします。無料のオンラインJSONフォーマッターツールは、ブラウザ内でフォーマット、検証、最小化、構文エラー検出を即座に処理します。

無料JSONフォーマット＆検証ツールをお試しください。

JSONとは？

JSON（JavaScript Object Notation）は、人間にとって読み書きしやすく、機械にとって解析・生成しやすい軽量のテキストベースデータ交換フォーマットです。Web API、設定ファイル、NoSQLデータベースにおけるデータ交換の事実上の標準となっています。

JSONドキュメントは2つの主要構造で構成されます：オブジェクト（波括弧{}で囲まれたキーと値のペアの集合）と配列（角括弧[]で囲まれた値の順序付きリスト）。値は文字列、数値、ブール値、null、オブジェクト、配列のいずれかです。

JSONはRFC 8259とECMA-404で定義されています。メディアタイプはapplication/json、ファイル拡張子は.jsonです。XMLとは異なり、JSONはコメント、名前空間、属性をサポートしていません。

JSONフォーマッターが必要な理由

可読性：APIからの生JSONは空白のない一行であることが多いです。JSONフォーマッターはインデントと改行を追加します。

デバッグ：JSONバリデーターは構文エラーの正確な位置を特定し、数秒で問題を発見できます。

検証：デプロイ前に常にJSONを検証し、サイレント障害や本番問題を防ぎましょう。

最小化：JSON最小化は不要な空白を除去し、ペイロードサイズを削減してAPIレスポンスを高速化します。

一般的なJSON構文エラー

JSON構文エラーはアプリケーション全体を壊す可能性があります。最も頻繁なミスは：

末尾のカンマ：JSONはオブジェクトや配列の最後の項目の後にカンマを許可しません。{"a": 1, "b": 2,}は無効です。

// INVALID: trailing comma
{
  "name": "John",
  "age": 30,
}

// VALID: no trailing comma
{
  "name": "John",
  "age": 30
}

シングルクォート：JSONはすべての文字列とキーにダブルクォートを必要とします。{'name': 'John'}は無効です。

// INVALID: single quotes
{'name': 'John', 'age': 30}

// VALID: double quotes
{"name": "John", "age": 30}

引用符なしのキー：すべてのキーはダブルクォートで囲まれた文字列でなければなりません。

コメント：標準JSONはコメントをサポートしません。JSONC、YAML、TOMLを使用してください。

// INVALID: comments not allowed in JSON
{
  "name": "John", // this is a comment
  "age": 30       /* block comment */
}

// VALID: no comments
{
  "name": "John",
  "age": 30
}

undefinedやNaN：JSONはnullのみサポートし、undefined、NaN、Infinityはサポートしません。

// INVALID in JSON (JavaScript-specific values)
{
  "value1": undefined,
  "value2": NaN,
  "value3": Infinity
}

// VALID: use null instead
{
  "value1": null,
  "value2": null,
  "value3": null
}

括弧の不一致：すべての{や[には対応する閉じ括弧が必要です。

無効なエスケープシーケンス：JSONは特定のエスケープシーケンスをサポート：\"、\\、\n、\r、\t、\uXXXX。

JSONのフォーマット方法

ワークフローに応じてJSONをフォーマットする方法はいくつかあります：

オンラインJSONフォーマッター：データを無料ツールに貼り付けて、即座にフォーマットと検証を行えます。

コマンドラインjq：jqは最も強力なコマンドラインJSONプロセッサです。

Python組み込みモジュール：python -m json.tool file.jsonでターミナルから直接フォーマット。

IDE拡張機能：VS Codeは組み込みJSON整形（Shift+Alt+F）を提供。JetBrainsはCtrl+Alt+L。

ブラウザDevTools：DevToolsはネットワークタブでJSON応答を自動的にフォーマットします。

JSON検証ルール

JSONを正しく検証するためのRFC 8259で定義されたルール：

データ型：JSONは6つの型をサポート：string、number、boolean、null、object、array。

// All six JSON data types demonstrated:
{
  "string": "Hello World",
  "number": 42.5,
  "boolean": true,
  "nullValue": null,
  "object": {
    "nested": "value"
  },
  "array": [1, "two", false, null, {"key": "val"}, [1,2,3]]
}

文字列：ダブルクォートで囲み、特定のエスケープシーケンスを使用。

数値：整数または浮動小数点、科学的記数法可、先頭ゼロ・NaN・Infinity不可。

// Valid JSON numbers:
42          // integer
-17         // negative integer
3.14        // floating point
2.5e10      // scientific notation
-1.23e-4    // negative scientific notation

// INVALID JSON numbers:
01          // leading zero not allowed
.5          // must have digit before decimal
+1          // leading plus not allowed
0xFF        // hex not allowed
0o77        // octal not allowed
NaN         // not a valid JSON value
Infinity    // not a valid JSON value

オブジェクト：キーは一意の文字列。空オブジェクト{}は有効。

配列：混合型の要素可。空配列[]有効。任意の深さのネスト。

エンコーディング：UTF-8がデフォルトで最も広く使用。

トップレベル値：RFC 8259はトップレベルに任意のJSON値を許可。

コード例：JSONのフォーマットと検証

JavaScript：JSONのフォーマットと検証

JavaScriptはJSON.parse()とJSON.stringify()で検証とフォーマットを提供：

// ===== JSON.parse(): Validate JSON =====

// Valid JSON string
const jsonString = '{"name": "Alice", "age": 30, "active": true}';
const data = JSON.parse(jsonString);
console.log(data.name); // "Alice"

// Validate JSON safely with try/catch
function isValidJSON(str) {
  try {
    JSON.parse(str);
    return true;
  } catch (e) {
    console.error('JSON syntax error:', e.message);
    return false;
  }
}

isValidJSON('{"valid": true}');     // true
isValidJSON('{invalid: true}');     // false — "Unexpected token i"
isValidJSON('{"trailing": 1,}');    // false — "Unexpected token }"

// ===== JSON.stringify(): Format / Pretty Print JSON =====

const obj = {
  name: "Alice",
  age: 30,
  address: {
    city: "New York",
    zip: "10001"
  },
  hobbies: ["reading", "coding", "hiking"]
};

// Pretty print with 2-space indentation
const formatted = JSON.stringify(obj, null, 2);
console.log(formatted);
/*
{
  "name": "Alice",
  "age": 30,
  "address": {
    "city": "New York",
    "zip": "10001"
  },
  "hobbies": [
    "reading",
    "coding",
    "hiking"
  ]
}
*/

// Pretty print with 4-space indentation
console.log(JSON.stringify(obj, null, 4));

// Pretty print with tab indentation
console.log(JSON.stringify(obj, null, "\t"));

// Minify JSON (no whitespace)
const minified = JSON.stringify(obj);
// {"name":"Alice","age":30,"address":{"city":"New York","zip":"10001"},...}

// Custom replacer: filter specific keys
const filtered = JSON.stringify(obj, ["name", "age"], 2);
/*
{
  "name": "Alice",
  "age": 30
}
*/

// Reviver function: transform values during parsing
const parsed = JSON.parse('{"date": "2025-01-15T00:00:00Z"}', (key, value) => {
  if (key === 'date') return new Date(value);
  return value;
});
console.log(parsed.date instanceof Date); // true

Python：JSONのフォーマットと検証

Pythonのjsonモジュールはjson.dumps()のindentパラメータでフォーマット：

import json

# ===== json.loads(): Validate JSON =====

json_string = '{"name": "Alice", "age": 30, "active": true}'
data = json.loads(json_string)
print(data["name"])  # "Alice"

# Validate JSON safely
def is_valid_json(s):
    try:
        json.loads(s)
        return True
    except json.JSONDecodeError as e:
        print(f"JSON syntax error at line {e.lineno}, col {e.colno}: {e.msg}")
        return False

is_valid_json('{"valid": true}')      # True
is_valid_json('{invalid: true}')      # False
is_valid_json('{"trailing": 1,}')     # False

# ===== json.dumps(): Format / Pretty Print JSON =====

data = {
    "name": "Alice",
    "age": 30,
    "address": {
        "city": "New York",
        "zip": "10001"
    },
    "hobbies": ["reading", "coding", "hiking"]
}

# Pretty print with 2-space indentation
formatted = json.dumps(data, indent=2)
print(formatted)

# Pretty print with sorted keys
formatted_sorted = json.dumps(data, indent=2, sort_keys=True)
print(formatted_sorted)

# Minify JSON (compact output)
minified = json.dumps(data, separators=(",", ":"))
print(minified)
# {"name":"Alice","age":30,"address":{"city":"New York","zip":"10001"},...}

# Handle non-ASCII characters (useful for i18n)
data_intl = {"city": "Tokyo", "greeting": "Hello"}
print(json.dumps(data_intl, ensure_ascii=False, indent=2))

# Read and format a JSON file
with open("data.json", "r") as f:
    data = json.load(f)

with open("data_formatted.json", "w") as f:
    json.dump(data, f, indent=2)

# Command line: python -m json.tool
# $ echo '{"a":1,"b":2}' | python -m json.tool
# {
#     "a": 1,
#     "b": 2
# }

コマンドライン：jq、python、node

コマンドラインでJSONをフォーマット・検証する各種ツール：

# ===== jq: The Swiss Army knife for JSON =====

# Pretty print JSON
echo '{"name":"Alice","age":30}' | jq .
# {
#   "name": "Alice",
#   "age": 30
# }

# Minify JSON (compact output)
echo '{
  "name": "Alice",
  "age": 30
}' | jq -c .
# {"name":"Alice","age":30}

# Extract specific fields
echo '{"name":"Alice","age":30,"city":"NYC"}' | jq '{name, city}'
# {"name": "Alice", "city": "NYC"}

# Format a JSON file
jq . input.json > formatted.json

# Validate JSON (exit code 0 = valid, non-zero = invalid)
echo '{"valid": true}' | jq . > /dev/null 2>&1 && echo "Valid" || echo "Invalid"
echo '{invalid}' | jq . > /dev/null 2>&1 && echo "Valid" || echo "Invalid"

# Sort keys
echo '{"b":2,"a":1,"c":3}' | jq -S .
# {"a": 1, "b": 2, "c": 3}

# ===== python -m json.tool =====

# Format JSON from stdin
echo '{"a":1,"b":2}' | python3 -m json.tool

# Format a JSON file
python3 -m json.tool input.json output.json

# Sort keys
echo '{"b":2,"a":1}' | python3 -m json.tool --sort-keys

# ===== Node.js one-liner =====

# Pretty print JSON
echo '{"a":1,"b":2}' | node -e "process.stdin.resume();let d='';process.stdin.on('data',c=>d+=c);process.stdin.on('end',()=>console.log(JSON.stringify(JSON.parse(d),null,2)))"

# Simpler: use node -p
node -p "JSON.stringify({a:1,b:[2,3]}, null, 2)"

curl + jq パイプライン

APIからJSONを取得してcurlからjqにパイプしてフォーマットする一般的なワークフロー：

# Fetch and format JSON from a REST API
curl -s https://api.github.com/users/octocat | jq .

# Fetch, extract specific fields, and format
curl -s https://api.github.com/users/octocat | jq '{login, name, bio, public_repos}'

# Fetch and validate (check exit code)
curl -s https://api.example.com/data | jq . > /dev/null 2>&1
if [ $? -eq 0 ]; then
  echo "Response is valid JSON"
else
  echo "Response is NOT valid JSON"
fi

# POST JSON and format the response
curl -s -X POST https://api.example.com/data \
  -H "Content-Type: application/json" \
  -d '{"name":"Alice","age":30}' | jq .

# Save formatted JSON to file
curl -s https://api.github.com/users/octocat | jq . > user.json

# Minify before sending (reduce payload size)
DATA=$(jq -c . large-payload.json)
curl -s -X POST https://api.example.com/data \
  -H "Content-Type: application/json" \
  -d "$DATA" | jq .

JSONベストプラクティス

クリーンで高パフォーマンスなJSONを書くためのベストプラクティス：

キーにcamelCaseを使用：ほとんどのJSON APIはcamelCaseを使用。API全体で一貫性を保ちましょう。

// camelCase (recommended for most APIs)
{
  "firstName": "Alice",
  "lastName": "Smith",
  "phoneNumber": "+1-555-0123",
  "isActive": true
}

// snake_case (common in Python/Ruby ecosystems)
{
  "first_name": "Alice",
  "last_name": "Smith",
  "phone_number": "+1-555-0123",
  "is_active": true
}

ネストを浅く保つ：深くネストされたJSON（3-4レベル以上）は読みにくいです。フラット化を検討してください。

// BAD: deeply nested (hard to read and parse)
{
  "company": {
    "departments": {
      "engineering": {
        "teams": {
          "frontend": {
            "members": [{"name": "Alice"}]
          }
        }
      }
    }
  }
}

// BETTER: flattened structure
{
  "companyId": "acme",
  "departmentId": "engineering",
  "teamId": "frontend",
  "members": [{"name": "Alice"}]
}

大きなファイルに注意：数MB以上のJSONファイルにはストリーミングパーサーを使用。

JSON Schemaで検証：本番環境ではajvやjsonschemaでJSON Schemaに対して検証。

// JSON Schema example for validating user objects
{
  "$schema": "https://json-schema.org/draft/2020-12/schema",
  "type": "object",
  "properties": {
    "name": { "type": "string", "minLength": 1 },
    "age": { "type": "integer", "minimum": 0 },
    "email": { "type": "string", "format": "email" },
    "roles": {
      "type": "array",
      "items": { "type": "string" },
      "minItems": 1
    }
  },
  "required": ["name", "email"]
}

バイナリデータを避ける：JSONはテキスト形式。バイナリデータにはBase64またはURLを使用。

一貫したnull処理：nullキーを省略するか明示的に含めるか決め、一貫して適用。

JSON vs 代替フォーマット：YAML、TOML、XML

JSONは唯一のシリアライゼーション形式ではありません。主要な代替との比較：

FeatureJSONYAMLTOMLXML
ReadabilityGoodExcellentExcellentModerate
CommentsNoYesYesYes
Data types6 typesRich (dates, etc.)Rich (dates, etc.)Text only
NestingUnlimitedUnlimitedLimitedUnlimited
Multi-line stringsNoYesYesYes (CDATA)
Parser supportUniversalWideGrowingUniversal
File sizeSmallSmallerSmallestLarge (verbose)
Best forAPIs, dataConfig filesSimple configDocuments, SOAP

APIにはJSON、編集可能な設定ファイルにはYAML、シンプルな設定にはTOML、既存標準（SOAP、RSS）にはXMLを選択。

よくある質問

オンラインでJSONをフォーマットするには？

生のJSONを当ツールのようなフォーマッターに貼り付けます。ツールが自動的に構文を検証し、インデントを追加し、エラーをハイライトします。2スペースまたは4スペースのインデントを選択可能。ツールはブラウザ内で完全に動作します。

一般的なJSON構文エラーは？

最も一般的なのは：末尾のカンマ、シングルクォート、引用符なしのキー、コメント、undefined/NaN値、括弧の不一致、無効なエスケープシーケンスです。

JSONとYAMLの違いは？

JSONは波括弧とダブルクォートを使用し、YAMLはインデントを使用します。YAMLはコメントと複数行文字列をサポート。JSONはマシン間のデータ交換に適し、YAMLは設定ファイルに適しています。JSONはYAMLの厳密なサブセットです。

JSONフォーマットと検証のマスターは現代の開発者にとって不可欠です。無料ツールで即座にフォーマットと検証を行えます。

無料オンラインツールでJSONを即座にフォーマット・検証・最小化。

𝕏 Twitterin LinkedIn
この記事は役に立ちましたか？

Stay Updated

Get weekly dev tips and new tool announcements.

No spam. Unsubscribe anytime.

Partner Picks

Sponsor this article

Place your product next to this developer topic with tracked clicks.

Ask about article sponsorship

Related Articles

JSON vs YAML vs TOML：どの設定フォーマットを使うべき？

JSON、YAML、TOML の設定フォーマットを比較。

JSON Schema バリデーション：型、ツール、ベストプラクティス

JSON Schema バリデーションのすべて：基本型から高度なパターン、バリデーションライブラリ、TypeScript や API との統合まで。

JSON Parse Error: Unexpected Token — 見つけ方と直し方

JSONパースエラーをステップバイステップでトラブルシューティング。unexpected tokenの原因、問題の特定方法、検証ツール。

JSONフォーマッター完全ガイド：オンライン・VS Code・コマンドラインでJSON整形（2026年版）

JSONの整形・美化方法を完全解説。オンラインツール、VS Code、jqコマンド、JavaScript/Pythonでのフォーマット方法。バリデーション、ミニファイ、ビューアー、よくあるエラーも網羅。

This site uses cookies for analytics and to display ads. By continuing to browse, you agree. Privacy Policy