json server使用簡介

2021-10-09 19:49:35 字數 1828 閱讀 2817

json-server是一款基於node.js的伺服器,為前端開發人員可以提供乙個高**的restful後台服務(資料原型),最讓人歡欣的是,整個服務的搭建過程不需要編寫任何**,最快只需要1分鐘。

本文以json-server為主線,講解一下json-server的搭建過程。

該伺服器是基於node.js的,所以它需要您提前安裝好node.js環境,具體的安裝配置過程很簡單,我不在這裡贅述。讀者可參閱如何安裝node.js一文。

開啟windows cmd視窗,輸入以下命令:

npm

install -g json-server

注意,上邊要使用-g的原因時,我們要在全域性使用json-server這個命令,所以請嚴格看上邊的命令來操作。若看到類似下邊的資訊,則證明已經安裝成功

當然,如果你還不放心,可以通過以下命令獲取一下json-server的版本(或許看到版本資訊會讓您心裡更踏實一些)

json-server --version
為了描述方便,我做以下假設:

專案目錄:j:/static_data_server

資料檔案:db.json 資料內容如下:

,]

,"phone_log":[

,]},

]}]}

啟動服務的命令(cmd命令執行的目錄需要在專案路徑下j:/static_data_server):

#以下命令啟動json-server 並監控名為db.json的檔案,服務埠預設為3000

json-server --watch db.json

#如果需要指定埠,可以如下方式指定

json-server --watch db.json --port 9527

看到了如下圖的資訊,您就啟動成功了

可以根據提示資訊訪問資源和資源主頁。另外,這個服務不僅僅支援簡單的瀏覽器訪問,您可以通過post、put、patch、delete等http method進行資料提交,博主建議安裝乙個postman除錯除錯,對您編寫http客戶端**有幫助。

以下的截圖給個參考(增加乙個名為emily的聯絡人):

在2.3節中講到了啟動命令,這個命令沒有必要沒次啟動json-server時都需要輸入一遍。可以將這個命令維護到npm的配置檔案中:

那首先要確保在當前目錄中有package.json這個檔案,如果沒有,可以通過(cmd命令執行的目錄需要在專案路徑下j:/static_data_server)

npm init -y
生成。然後開啟編輯,增加如下圖所示的**:

以後,啟動時,僅在cmd中輸入(cmd命令執行的目錄需要在專案路徑下j:/static_data_server)

#注意,這裡的json,在package.json中,只是那一長串命令的別名

npm run json

就可以了。

以下是啟動後,在瀏覽器上看到的主頁

json server 的簡單使用

做前端的,有時候後台沒有資料,但是呢我們有不可避免的使用虛擬的資料 mock資料 我們並不想使用簡單的靜態資料,而是希望自己起乙個本地的 mock server 來完成模擬請求以及響應請求的過程。json server 是可以替代我們完成這一工作的工具。我們只需要自己寫乙個 json 檔案,或者寫幾...

json server的基本使用

npm i g json server在電腦合適的位置建立乙個資料夾,盡量是英文 在資料夾中建立乙個db.json,並進行編輯 當我們在db.json中寫入以下內容時,未來會給你我們提供下列介面 get books 獲取所有資訊 get books id 獲取單個資訊 post books 新增資料...

json server的基本使用

npm i g json server在電腦合適的位置建立乙個資料夾,盡量是英文 在資料夾中建立乙個db.json,並進行編輯 當我們在db.json中寫入以下內容時,未來會給我們提供下列介面 get books 獲取所有資訊 get books id 獲取單個資訊 post books 新增資料 ...