iT邦幫忙

1

請問沒有後端的情況下如何在線上環境模擬API?

  • 分享至 

  • xImage

#react.js #next.js

get post put patch delete這些都要模擬
發出post/put/patch後要真的新增/修改資料
發出delete請求要真的刪除資料
但是完全不串接後端。
當然重新整理網頁後資料變回原本的樣子是OK的

雖然找到了json-server與miragejs這兩個套件
但似乎不能在線上環境工作,所以不能用

請問我是不是只能自己寫一大堆物件充當臨時簡易資料庫?


非常感謝大家回應,有這麼多東西看來要花不少時間研究了

看更多先前的討論...收起先前的討論...
PY iT邦新手 3 級 ‧ 2023-03-01 12:30:17 檢舉
express 如何
我都是先用這個來代替
silarce iT邦新手 5 級 ‧ 2023-03-01 12:52:49 檢舉
express 我記得是後端用的模組不是嗎?
能夠在沒有後端伺服器的情況使用嗎?
froce iT邦大師 1 級 ‧ 2023-03-01 13:09:40 檢舉
https://github.com/temrdm/rest-emulator

有裝node.js就能用。且能在本機上另開port當後端。
silarce iT邦新手 5 級 ‧ 2023-03-01 22:18:57 檢舉
非常感謝大家回應,有這麼多東西看來要花不少時間研究了
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中
1
Yaowen
iT邦研究生 4 級 ‧ 2023-03-01 11:48:44

你可以用google Sheet 寫API 然後自己串
Google Apps Script

0
alien663
iT邦研究生 5 級 ‧ 2023-03-01 16:04:48

上面幾位大大都挺厲害的,我自己都是用笨方法,已樓主的狀況來說,可能就是直接建立一個data.json的檔案,然後讀進前端記憶體當中做修改就好。
至於模擬API的行為,就是直接寫成像下面這樣,直接回傳寫死的Promise。

const get_sample = (req) => {
        return new Promise((resolve, reject) => {
            resolve({
                "body":[
                    {
                        "TID": 4,
                        "TName": "我不會飛",
                        "TDes": "abcd"
                    },
                    {
                        "TID": 5,
                        "TName": "abcd",
                        "TDes": "abcd"
                    },
                    {
                        "TID": 8,
                        "TName": "A1",
                        "TDes": "B1"
                    },
                    {
                        "TID": 9,
                        "TName": "A2",
                        "TDes": "B2"
                    },
                    {
                        "TID": 10,
                        "TName": "A3",
                        "TDes": "B3"
                    },
                    {
                        "TID": 11,
                        "TName": "A4",
                        "TDes": "B4"
                    }
                ]
            })
        })
    }
0
DanSnow
iT邦好手 1 級 ‧ 2023-03-01 17:39:03

我個人很推這套 https://mswjs.io/ ,可以用靜態的資料來模擬 API ,也可以再加個 lowdb 弄個真的有功能的 API (當然資料不會真的存下來)

而且它可以讓你直接用 fetch, axios 之類的你原本愛用的 http client ,不用修改就可以直接動,等到真的後端上線後,只要移除掉 msw 的初始化相關的 code ,你的程式就會改用真的後端了

我要發表回答

立即登入回答