開發網頁前端時，會需要用到後端回傳的 api 數據來渲染頁面，如果雙方依照需求規格書好好實作會天下太平；但在現實生活中總是會有例外發生，如果後端傳給前端時的資料格式不夠穩定，前端在渲染的時候就可能會出錯。遇到這種狀況時，「jsonschema」套件就是你的救星！
一、「jsonschema」是什麼？二、「jsonschema」有哪些優點？三、「jsonschema」驗證範例
➤ 簡單範例
➤ 複雜點的範例
➤ 常見的陣列範例四、「jsonschema」其他功能
一、「jsonschema」是什麼？
如果你常常被後端回傳的 json 資料整，那這個套件你一定要學習；他是一個專們用來驗證 json 格式是否符合預期的套件。
可透過下面指令安裝：
npm i jsonschema二、「jsonschema」有哪些優點？
- 可以詳細定義要驗證的 json 格式，包含內部所有參數的型態（string/number/array/object）
- 驗證結果會用 true/false 回傳
- 發生 error 時，會很明確的指出是在哪個位置出錯
- 可以客製化回傳錯誤的訊息
- 學習及使用非常直覺
三、「jsonschema」驗證範例
➤ 簡單範例：
我們要驗證 「4」 這個 instance 的 type 是否為 number。
程式執行結果為：
解說：因為 「4」的確是「number」的type，所以在「errors」參數的結果為 empty array。
➤ 複雜點的範例：
- 建立「驗證地址格式」的「addressSchema」
- 建立「驗證個人格式」的「schema」，並且讓個人格式的「address」關聯到「addressSchema」
- 建立一個人的物件（p），填入個人訊息
- 使用「jsonschem」提供的「Validator」 function 來驗證物件(p)是否符合個人格式(addressSchema)
程式執行結果為：
解說：因為我們在「shemca」這個變數下設定「vote」需要為「integer」的type；但是我們傳入的「vote」內容為「lots」的字串，所以「errors」會回傳一個「is not of a type(s) integer」的錯誤訊息。
➤ 常見的陣列範例：
後端 api 其實很常回傳這類陣列的資訊，但因為各種歷史業障；在版本更新時，舊資料在新欄位的資料往往是空的，這時驗證回傳資料的動作就很重要了！
下面是模擬後端回傳「名字」的陣列，用「arraySchema」做格式驗證：
程式執行結果為：
解說：除了第一個「寶寶不說」外，我們每個 instance 其實都故意給他錯誤的資訊，來確認這個格式驗證是否生效，錯誤結果在「errors」裡面呈現的很完美。
四、「jsonschema」其他功能
請參考官方網站，上面提供更多詳實的範例。
▶︎ 如果這篇文章有幫助到你1. 可以點擊下方「Follow」來追蹤我～
2. 可以對文章拍手讓我知道 👏🏻你們的追蹤與鼓勵是我繼續寫作的動力 🙏🏼▶︎ 如果你對工程師的職涯感到迷茫1. 也許我在iT邦幫忙發表的系列文可以給你不一樣的觀點 💡
2. 也歡迎您到書局選購支持，透過豐富的案例來重新檢視自己的職涯
