fbpx

JSON Server:30 秒內不用寫程式建立完整的偽裝的 REST API

Contents

專案介紹

無論是開發 Web 前端或是 Mobile App ,當應用程式的資料需要後端支援,這時候通常會定義 REST API 來取得後端的資料,但是前端/App 開發人員總不能等後端開發人員將 REST API 都實現完成才開始寫程式,現在有了這個開源工具 – JSON Server,可以很快的為前端/App開發人員提供 “mock data” ,這樣前後端的開發人員就可以同步開發了

安裝 JSON Server

首先你必須先安裝好 nodejs ,然後使用 npm 安裝

npm install -g json-server

建立一個 db.json 裡面設定你要測試的假資料

{
  "posts": [
    { "id": 1, "title": "json-server", "author": "typicode" }
  ],
  "comments": [
    { "id": 1, "body": "some comment", "postId": 1 }
  ],
  "profile": { "name": "typicode" }
}

啟動 JSON Server

json-server --watch db.json

現在打開瀏覽器連到 http://localhost:3000posts/1,你就會得到

{ "id": 1, "title": "json-server", "author": "typicode" }

在做請求時,最好知道:

  • 如果你發出POST,PUT,PATCH或DELETE請求,更改將使用 lowdb 自動安全地保存到db.json。
  • 你的請求 body JSON應該是封閉的物件,就像 GET 輸出一樣。 (例如{“name”:“Foobar”})
  • Id值不可變。 PUT 或 PATCH 請求 body 中的任何 id 值修改都將被忽略。 只有在 POST 請求中設置的值才會被遵守,但僅限於尚未採用的值。
  • POST,PUT 或 PATCH 請求應包含 Content-Type:application / json標頭,以在請求的 body 中使用JSON。 否則它將導致 200 OK 但不對資料進行更改。

更多的功能

JSON-Server 還有支援

  • 自定義 Routes 
  • Filter  – 可使用 . 訪問深層屬性,例如  GET /comments?author.name=typicode
  • 排序:GET /posts?_sort=views&_order=asc
  • 分頁:GET  /posts?_page=7
  • 切割:添加 _start 和 _end 或 _limit(回應中包含 X-Total-Count 標頭)GET /posts?start=20&_end=30,與 Array.slice 完全一樣(即_start是包含的,_end是排除的)
  • 操作元:_gte ( 大於 ),_lte( 小於 ) _ne ( 不等於 ) _like ( 支援 RegExp ) , 用法例如 GET /posts?id_ne=1 ,更多操作元範例可查看專案網頁
  • 全文檢索:例如 GET  /posts?q=internet
  • 關聯:要包含子資源,請添加_embed,例如 GET /posts/1?_embed=comments,包含上層的資源使用 _expand ,例如 GET /comments/1?_expend=post
  • 資料庫:GET /db
  • 當作靜態網頁伺服器
  • 支援 CORS 和 JSONP
  • 可載入遠端的 JSON : json-server http://example.com/file.json
  • 使用 Javascript 產生隨機的資料 : 例如產生 1000 筆的 JSON 物件來做測試
  • 支援 HTTPS : 使用 hotel
  • 可加入  middlewares ( 作法跟 nodejs 一樣 )
  • 將 JSON-Server 當作 nodejs 的模組使用:如果需要添加身份驗證,驗證或任何行為,可以將 JSON-Server 作為模組與其它 Express middleware 結合使用。

如果你的工作是網頁前端開發,或是手機 App 開發人員,必須要跟後端開發人員合作,JSON-Server 可以說是一個可以同步開發的必備工具,App/前端跟後端整合不用等 REST API 都開發好,只要定義好 REST API 的 JSON 物件結構,就可以同步開發了

專案網址

不受 FB 演算法影響,歡迎透過 e-mail 訂閱網站更新

支持 Soft & Share

❤️您應該有留意到,我們的網頁並不會出現干擾人的跳出煩人的廣告或是在內容中嵌入廣告,因為我們發現這樣對閱讀網頁的內容體驗真的是不好!

如果您覺得我們提供的內容服務還不錯,歡迎透過對以下產品/服務的購買投資來支持本站的營運走得更遠

如果暫時還不需要以下的付費服務,幫我們把這個網站分享給有需要的朋友,您的小小舉動會對 Soft & Share 有莫大的幫助!感謝您的支持!

🎈如果您點選優惠連結後,還是沒有看到優惠價格,請將瀏覽器的 cookie 清除 ( 清除 udemy 網站的就可以了 ),然後重新點選優惠連結並登入 Udemy 就可以了

相關線上課程


不受 FB 演算法影響,歡迎透過 e-mail 訂閱網站更新

Comments are closed.

Powered by WordPress.com.

Up ↑

%d 位部落客按了讚: