json-server的搭建及端口的反向代理
2021-10-20 10:33:22

本文首發于微信公眾號："算法與編程之美"，歡迎關注，及時了解更多此系列文章。

問題描述

Json-server是一個前端非常方便的mockserver工具,通俗來說，就是模擬服務端接口數據，一般用在前后端分離后，前端人員可以不依賴API開發，而在本地搭建一個JSON服務，自己產生測試數據,可以根據不同的后綴獲取到不同的數據,使用json-server搭建的服務器端口只是一個簡單的端口，為了更加方便還需要Nginx進行反向代理，例如將localhost:3000/xxxx改成www.xxx.com這樣的形式。

解決方案

由于json-server需要通過Node對其進行啟動，所以首先要安裝Node。

一、全局安裝json-server：

二、安裝完成，查看版本

三、選擇一個目錄，新建立一個json文件，例如Student.json

{
"student": [
        {
"id": 1,
"desc": "Jack",
"completed": false
        },
        {
"id": 2,
"desc": "Ali",
"completed": false
        },
        {
"id": 3,
"desc": "Bob",
"completed": false
        }
    ]

}

四、啟動json-server服務：在新建的json文件目錄，運行命令：json-server + 文件名

五、得到的輸出結果

六、瀏覽器中輸入地址http://localhost:3000/cars就能看到輸出cars.json的內容。

七、至此，就搭建了一個簡單的本地測試服務器，json-server支持get,post等。

八、Nginx的反向代理，Nginx的安裝

九、打開cmd窗口，cd到nginx的目錄下

十、配置Nginx，在Nginx文件下找到nginx.conf文件進行修改

一是修改端口號為8080,一是指定網站的位置為f: ginx-1.12.2html

最后在cmd中啟動Nginx，指令：nginx

五、訪問默認頁面

Nginx啟動后，在瀏覽器中訪問http://localhost:8080，可以看到默認的歡迎頁面,到此，window下的nginx配置完成。