千鋒教育-做有情懷、有良心、有品質(zhì)的職業(yè)教育機(jī)構(gòu)

手機(jī)站
千鋒教育

千鋒學(xué)習(xí)站 | 隨時(shí)隨地免費(fèi)學(xué)

千鋒教育

掃一掃進(jìn)入千鋒手機(jī)站

領(lǐng)取全套視頻
千鋒教育

關(guān)注千鋒學(xué)習(xí)站小程序
隨時(shí)隨地免費(fèi)學(xué)習(xí)課程

當(dāng)前位置:首頁(yè)  >  技術(shù)干貨  > 使用Apifox快速M(fèi)ock數(shù)據(jù)

使用Apifox快速M(fèi)ock數(shù)據(jù)

來(lái)源:千鋒教育
發(fā)布人:wjy
時(shí)間: 2022-06-02 15:00:00 1654153200

**1、介紹**

此前,接口管理采用的常用解決方案如:

- 使用 Swagger 管理 API 文檔
- 使用 Postman 調(diào)試 API
- 使用 mockjs 等工具 Mock API 數(shù)據(jù)
- 使用 JMeter 做 API 自動(dòng)化測(cè)試

使用Apifox快速M(fèi)ock數(shù)據(jù)

但是上述的管理方案存在很多問(wèn)題,如:維護(hù)不同工具之間數(shù)據(jù)一致性非常困難、低效。并且這里不僅僅是工作量的問(wèn)題,更大的問(wèn)題是多個(gè)系統(tǒng)之間數(shù)據(jù)不一致,導(dǎo)致協(xié)作低效、頻繁出問(wèn)題,讓開(kāi)發(fā)測(cè)試人員痛苦不堪。

Apifox 是 API 文檔、API 調(diào)試、API Mock、API 自動(dòng)化測(cè)試一體化協(xié)作平臺(tái),**定位 Postman + Swagger + Mock + JMeter**。通過(guò)一套系統(tǒng)、一份數(shù)據(jù),解決多個(gè)系統(tǒng)之間的數(shù)據(jù)同步問(wèn)題。只要定義好 API 文檔,API 調(diào)試、API 數(shù)據(jù) Mock、API 自動(dòng)化測(cè)試就可以直接使用,無(wú)需再次定義;API 文檔和 API 開(kāi)發(fā)調(diào)試使用同一個(gè)工具,API 調(diào)試完成后即可保證和 API 文檔定義完全一致。高效、及時(shí)、準(zhǔn)確!

## **2.1、新建項(xiàng)目**

在`團(tuán)隊(duì)`欄目下,點(diǎn)擊`新建項(xiàng)目`,在彈出的對(duì)話框中填入合適的內(nèi)容后點(diǎn)擊`保存`按鈕:

1

隨后點(diǎn)擊剛才創(chuàng)建的項(xiàng)目名稱進(jìn)入項(xiàng)目:

2

進(jìn)入項(xiàng)目后可以根據(jù)實(shí)際的開(kāi)發(fā)需要決定是否新建分組來(lái)做接口分類:

3

例如,按照功能模塊分類,則效果如下:

4

Apifox允許支持多級(jí)分組,如果需要繼續(xù)分組,可以在已有的分組后方點(diǎn)擊`...`繼續(xù)選擇`新建子分組`。

## **2.2、使用Apifox來(lái)mock數(shù)據(jù)**

在項(xiàng)目的開(kāi)發(fā)過(guò)程中,后端因?yàn)楣ぷ髁看螅荒芗皶r(shí)的給到接口給前端做研發(fā)調(diào)試,前端經(jīng)常需要自己去mock數(shù)據(jù)來(lái)進(jìn)行本地的研發(fā)。雖然可以采用mockjs來(lái)制造假數(shù)據(jù),但對(duì)于新手來(lái)講難度較大,上手比較困難,在Apifox下,mock數(shù)據(jù)的操作就比較簡(jiǎn)單了。接下來(lái)我們以`用戶管理`模塊為例,制作一個(gè)`用戶列表`的mock數(shù)據(jù)模型。

步驟1:在`數(shù)據(jù)模型`選項(xiàng)卡下,新建`用戶管理`分組,用來(lái)與`用戶管理`接口對(duì)應(yīng)

5

步驟2:新建`用戶列表`數(shù)據(jù)模型

> 數(shù)據(jù)模型:描述接口返回?cái)?shù)據(jù)格式的一種方式,在與后端對(duì)接完接口設(shè)計(jì)規(guī)范后即可產(chǎn)出。

例如,我們與后端對(duì)接要求`用戶列表`接口需要返回以下基本信息:

```json
{
    "desc": "操作成功",
    "code": 200,
    "data": [
        {
            "id": "1",
            "name": "1號(hào)用戶",
            "mobile": "13312345678",
            "email": "airchina@website.com",
            "gender": 1,
            "status": 1,
            "head_img":""
        }
    ]
}
```

那么我可以根據(jù)上述的json在Apifox中按照如下方式進(jìn)行數(shù)據(jù)模型的創(chuàng)建:

> 小提示:這里我們可以通過(guò)軟件界面中`JSON/XML智能識(shí)別/快捷導(dǎo)入`功能來(lái)快速生成基本結(jié)構(gòu),然后根據(jù)需要做出適當(dāng)?shù)恼{(diào)整得到以下效果。

6

由于列表中的記錄數(shù)往往比較多,這里我們還可以設(shè)置`data`中`items`的數(shù)量范圍,在`data`節(jié)點(diǎn)后面點(diǎn)擊小齒輪圖表,然后根據(jù)需要輸入數(shù)量范圍:

7

隨后點(diǎn)擊`預(yù)覽`檢查生成結(jié)果是否正確,如下則正常:

8

最后,當(dāng)一個(gè)數(shù)據(jù)模型設(shè)計(jì)完畢后,記得點(diǎn)擊右上角的`保存`按鈕。

9

## **2.3、接口設(shè)計(jì)與調(diào)試**

在有數(shù)據(jù)模型后,我們還需要進(jìn)行本地接口設(shè)計(jì),確保數(shù)據(jù)模型可以使用。

步驟1:進(jìn)入`接口管理`選項(xiàng)卡,在對(duì)應(yīng)的分組后面,點(diǎn)擊`+`來(lái)新建接口,并將環(huán)境切換為`Mock服務(wù)`,在本界面填入接口的基本信息,隨后點(diǎn)擊`保存`按鈕

10

步驟2:點(diǎn)擊`修改文檔`,將返回的`根節(jié)點(diǎn)`改為與之對(duì)應(yīng)的數(shù)據(jù)模型(根據(jù)實(shí)際情況,修改請(qǐng)求頭和參數(shù)信息)

11

步驟3:點(diǎn)擊`修改文檔`底部的`創(chuàng)建示例`按鈕,選擇成功示例,點(diǎn)擊`確定`,再點(diǎn)擊右上角`保存`來(lái)完善接口文檔

12

步驟4:接口調(diào)試

 

如果該步驟能夠成功返回?cái)?shù)據(jù),那么我們就可以在Vue或React等開(kāi)發(fā)環(huán)境中先使用`實(shí)際請(qǐng)求`中的`請(qǐng)求URL`進(jìn)行AJAX請(qǐng)求來(lái)獲取模擬的業(yè)務(wù)數(shù)據(jù),該地址支持跨域請(qǐng)求:

 

上述地址在瀏覽器中的請(qǐng)求效果:

15

## **2.4、接口分享**

Apifox還支持將寫(xiě)好的接口分享給其他人,這樣就很方便將資源進(jìn)行共享了。

16

**3、寫(xiě)在最后**

Apifox這款開(kāi)發(fā)神器,功能遠(yuǎn)遠(yuǎn)不僅僅只是快速M(fèi)ock數(shù)據(jù),其還支持很多開(kāi)發(fā)中實(shí)用的功能,例如:前置操作、后置操作、持續(xù)集成、代碼生成等,它還有更多的功能等著你去發(fā)現(xiàn)!更多關(guān)于“web前端培訓(xùn)”的問(wèn)題,歡迎咨詢千鋒教育在線名師。千鋒已有十余年的培訓(xùn)經(jīng)驗(yàn),課程大綱更科學(xué)更專業(yè),有針對(duì)零基礎(chǔ)的就業(yè)班,有針對(duì)想提升技術(shù)的提升班,高品質(zhì)課程助理你實(shí)現(xiàn)夢(mèng)想。

tags:
聲明:本站稿件版權(quán)均屬千鋒教育所有,未經(jīng)許可不得擅自轉(zhuǎn)載。
10年以上業(yè)內(nèi)強(qiáng)師集結(jié),手把手帶你蛻變精英
請(qǐng)您保持通訊暢通,專屬學(xué)習(xí)老師24小時(shí)內(nèi)將與您1V1溝通
免費(fèi)領(lǐng)取
今日已有369人領(lǐng)取成功
劉同學(xué) 138****2860 剛剛成功領(lǐng)取
王同學(xué) 131****2015 剛剛成功領(lǐng)取
張同學(xué) 133****4652 剛剛成功領(lǐng)取
李同學(xué) 135****8607 剛剛成功領(lǐng)取
楊同學(xué) 132****5667 剛剛成功領(lǐng)取
岳同學(xué) 134****6652 剛剛成功領(lǐng)取
梁同學(xué) 157****2950 剛剛成功領(lǐng)取
劉同學(xué) 189****1015 剛剛成功領(lǐng)取
張同學(xué) 155****4678 剛剛成功領(lǐng)取
鄒同學(xué) 139****2907 剛剛成功領(lǐng)取
董同學(xué) 138****2867 剛剛成功領(lǐng)取
周同學(xué) 136****3602 剛剛成功領(lǐng)取
相關(guān)推薦HOT
抖音小店運(yùn)營(yíng)做什么的

在當(dāng)前的電商市場(chǎng)中,抖音小店已經(jīng)逐漸成為一種新的電商模式,它集成了社交化、音視頻分享、直播銷售等多種功能,使得消費(fèi)者更加便捷地進(jìn)行商品...詳情>>

2023-10-08 16:36:41
抖音小店照片要求尺寸多大

在抖音平臺(tái)開(kāi)設(shè)小店已經(jīng)成為了越來(lái)越多人的選擇,相信大家已經(jīng)在各大社交平臺(tái)上看到有不少小店的推廣。在抖音上,照片是展示產(chǎn)品的重要手段,因...詳情>>

2023-10-08 16:14:25
抖音招商團(tuán)長(zhǎng)托管服務(wù)費(fèi)怎么退回來(lái)

抖音招商團(tuán)長(zhǎng)托管服務(wù)是抖音為有意愿創(chuàng)作內(nèi)容并帶動(dòng)其他創(chuàng)作者成為團(tuán)隊(duì)成員的用戶提供的一種服務(wù)。通過(guò)該服務(wù),招商團(tuán)長(zhǎng)可以自主組建團(tuán)隊(duì)并得到...詳情>>

2023-10-08 16:08:53
抖音小店怎么做代銷

抖音已經(jīng)成為了一個(gè)非常受歡迎的短視頻應(yīng)用程序,在其中許多用戶都精心打造了自己的小店,用于銷售各種各樣的商品,獲取額外的收入。然而,要想...詳情>>

2023-10-08 15:28:41
怎樣開(kāi)抖音小店帶貨賺錢(qián)

隨著直播帶貨的火熱,越來(lái)越多的人開(kāi)始嘗試通過(guò)抖音小店來(lái)開(kāi)展帶貨業(yè)務(wù)。抖音小店是抖音直播帶貨的配套,可以讓用戶在購(gòu)買(mǎi)直播中產(chǎn)品時(shí)就實(shí)現(xiàn)購(gòu)...詳情>>

2023-10-08 15:06:36
快速通道