單元 7 · JSON 生態系

API、設定檔、jq、Schema — Ecosystem

← 單元教學

語法學會了，這一單元看 JSON 在哪裡「被使用」——以及隨之而來的工具與標準。

API 傳輸 · The Ubiquitous Format

REST API 的回應體幾乎都是 JSON，請求體也常用 JSON（Content-Type: application/json）。

HTTP 回應 · RESPONSE
HTTP/1.1 200 OK
Content-Type: application/json

{ "id": 7, "title": "Hello", "done": false }

設定檔 · Config Files

很多工具用 JSON（或它的延伸格式）當設定：

檔案用途註解?
package.jsonNode 專案與相依管理❌（純 JSON）
tsconfig.jsonTypeScript 編譯設定✅（JSONC）
settings.jsonVS Code 使用者設定✅（JSONC）
composer.jsonPHP Composer❌
.babelrcBabel 設定看版本（可用 JSON5）
重要：package.json 是純 JSON（npm 不容許註解）； VS Code 自己的檔案才容許 JSONC。別搞混，否則一存檔就報錯。

jq · 命令列 JSON 處理器

jq 是終端機裡的 JSON 瑞士刀——查詢、過濾、轉換一把抓。五分鐘上手：

jq 常用指令 · COMMANDS
# 格式化（美化縮排）
echo '{"a":1}' | jq .

# 取欄位
cat data.json | jq '.users[0].name'

# 過濾條件
cat data.json | jq '.users[] | select(.active == true)'

# 選多欄（重組成新物件）
cat data.json | jq '{total: .meta.total, names: [.users[].name]}'

想知道有哪些欄位？jq 'keys' 列出所有鍵。

JSON Schema · 格式驗證

JSON Schema 是描述「JSON 該長什麼樣」的標準（draft-07 最常見）。 用一份 schema 就能驗證資料是否合格、產生文件、甚至自動補全。

Schema · 範例
{
  "type": "object",
  "required": ["name"],
  "properties": {
    "name": { "type": "string" },
    "age": { "type": "integer", "minimum": 0 }
  }
}
應用 · USED BY
OpenAPI（Swagger）→ API 文件
VS Code → 設定檔自動補全
前端表單 → 自動驗證
CI → 拒絕壞格式的設定

JSONP · 歷史與 CORS 問題

JSONP（JSON with Padding）是古早的跨域技巧：用 <script> 標籤載入 包在函式呼叫裡的 JSON，繞過瀏覽器同源政策。現代已被 CORS + fetch 取代， 但偶爾在舊系統看到。辨識特徵：回傳像 callback({...})。

JSON 在資料庫與串流

看完這頁你應該能說出：
  • JSON 在 API 傳輸與設定檔的角色。
  • package.json（純 JSON）與 tsconfig（JSONC）的註解差異。
  • jq 的三種基本用法：取欄位、過濾、重組。
  • JSON Schema 是什麼、被誰用。
  • JSONP 的由來與為何被取代。

延伸閱讀

← 上一篇
單元 6 · 延伸格式
下一篇 →
單元 8 · 實作與最佳實踐