先讓 JSON 變得容易閱讀

API 回應、Webhook payload、日誌與設定檔都常使用 JSON。
但實務上拿到的 JSON 可能被壓成一行，也可能有很深的巢狀結構或大量跳脫字元。

JSON 格式化與驗證：安全檢查 API 回應的方法

如果直接閱讀，很容易漏掉重要欄位，或誤解陣列與物件的邊界。
先格式化 JSON，能讓資料結構變清楚，後續除錯與文件整理也會更順。

舉例來說，假設收到下面這樣的單行回應：

{"id":42,"name":"Alice","roles":["admin","editor"],"profile":{"city":"Tokyo"}}

格式化後，巢狀與陣列結構便一目了然：

{
  "id": 42,
  "name": "Alice",
  "roles": ["admin", "editor"],
  "profile": {
    "city": "Tokyo"
  }
}

格式化後應該檢查什麼

巢狀結構

格式化後可以清楚看出每個欄位屬於哪個物件。
當你要確認 user.profile.name 這類路徑，或檢查陣列中的物件是否一致時特別有用。

值的型別

"123" 是字串，123 是數字。
"true" 不等於 true，null 也不等於空字串。
早點確認這些差異，可以避免畫面顯示、資料驗證與系統整合上的錯誤。

語法錯誤

多餘的逗號、少掉的括號、沒有加引號的 key，都是常見的 JSON 問題。
使用會解析內容的格式化工具，可以在資料進入應用程式之前先找出錯誤。

下面的範例中，有兩處作為 JSON 是無效的：

{
  "name": "Alice",
  "tags": ["a", "b",],   // 結尾多餘的逗號
  age: 30                 // key 沒有加引號
}

JSON 不允許結尾逗號、註解或沒有引號的 key。在複製手寫的 JSON 或 JavaScript 物件實字時容易混入，因此先用格式化工具確認能否解析較為安全。

常見使用情境

  • API 除錯: 貼上瀏覽器 Network 面板或 curl 的輸出，檢查回傳欄位。
  • 日誌分析: 將一行式結構化日誌整理成容易閱讀的格式。
  • 範例資料整理: 準備文件、測試或錯誤回報用的 JSON 範例。
  • Schema 準備: 以整理好的 JSON 產生 TypeScript 型別、Zod Schema 或 OpenAPI 定義。

使用 DevToolKits 處理 JSON

JSON 格式化工具 可以直接在瀏覽器中格式化與驗證 JSON。
確認結構後，也可以接著使用相關工具：

JSON 格式化看起來只是小步驟，但它通常是整個資料工作流程的起點。

常見問題

JSON 可以寫註解或結尾逗號嗎？

標準 JSON 既不允許註解，也不允許結尾逗號。這些是 JSON5 或 JSONC 等擴充規格的功能，部分設定檔工具自行支援。用於與 API 交換的資料時，請用格式化工具確認其為有效的標準 JSON。

把含機密資料的 JSON 貼到外部工具安全嗎？

把含有 API Key 或個資的回應，傳送到處理方式不明的外部服務並不可取。JSON 格式化工具 在你的瀏覽器內完成處理，不會將輸入傳送到伺服器，因此可安心用於檢視機密資料。

格式化之後該做什麼？

掌握結構後，可依需求延伸到型別、驗證或 API 規格：需要型別用 TypeScript 型別生成，需要執行期檢查用 Zod Schema 生成，要共享規格用 OpenAPI 生成，都是很好的起點。