前端開發過程中調用后台接口是常事,在前后台定義好接口規范和參數后,后台接口的進度有時會成為我們的掣肘,這里推薦使用一款簡單的小工具json-server,小而輕便。
確保本地已有node環境。
一:安裝json-server
npm install -g json-server
二:創建json-server文件
在項目文件夾創建一個文件夾,隨意命名,這里命名為API-server,在API-server文件夾下創建json格式文件,這里命名為db.json。如下圖:

三:創建數據並啟動json服務
在第二部創建的db.json文件中填充json數據:如下圖:

插入完數據后,cd 到 api-server文件夾下啟動json服務,運行 json-server --watch db.json 如下圖:

運行完后本地就已經生成了兩個API,在瀏覽器輸入localhost:3000/posts就會出現相應數據,如下圖:

四:進行應用
現在本地已經生成了相應的api接口,可以使用ajax進行相應接口調用,接口會返回相應的數據。如下圖:

或者是這樣的 $.get('localhost:3000/posts',function(){});
五:修改監聽端口
修改監聽端口,可以開啟多個終端進行多個json文件的監聽
json-server --watch -port 8888 db.json(監聽8888端口)
六:RESTful風格接口實現CURD:
RESTful API設計指南:推薦阮一峰的(http://www.ruanyifeng.com/blog/2014/05/restful_api.html)
根據請求方法的不同來實現不同的目的
GET : 獲取數據(獲取表單列表數據)
POST : 新增數據(新增一個表單項)
DELETE :刪除數據(刪除一條表單數據)
PATCH :更新數據 (修改一條表單數據)//根據某個屬性修改,上傳修改的某個屬性
PUT :更新數據(修改一條表單數據)//更新整條數據,上傳修改的整條數據
七:數據過濾
數據過濾是json-server中非常強勁的功能,通過url加上簡單的query字段,即可以過濾得到各種各樣的數據
八:表單分頁的簡單實現
json-server的高級定義,高級過濾等(未完待續!!!)
