摘要:本文適用的場景在對移動端的純移動端功能或者前端頁面的純前端功能進(jìn)行測試時,服務(wù)端接口返回的數(shù)據(jù)不滿足要求,或者制造測試數(shù)據(jù)比較復(fù)雜,需要使用方法來快速構(gòu)造數(shù)據(jù)。進(jìn)入官網(wǎng)后,首先創(chuàng)建一個項目,一個項目包含若干個接口,我們最終模擬的是接口。
本文適用的場景:在對移動端APP的純移動端功能或者前端H5頁面的純前端功能進(jìn)行測試時,服務(wù)端接口返回的數(shù)據(jù)不滿足要求,或者制造測試數(shù)據(jù)比較復(fù)雜,需要使用Mock方法來快速構(gòu)造數(shù)據(jù)。
Mock這個單詞有模擬、效仿的意思,在軟件開發(fā)中,通常指一個模擬的對象。這個模擬對象是真實對象的替代品,有了Mock,團(tuán)隊成員之間可以并行工作,而不必等待需要依賴的其他接口完成后才能開始工作。
在開發(fā)階段,尤其是聯(lián)調(diào)之前,Mock經(jīng)常被開發(fā)人員用來進(jìn)行調(diào)試;
在測試階段,測試人員也可以用Mock提高我們的測試效率,不止在單元測試的測試腳本中可以應(yīng)用,也可以應(yīng)用在系統(tǒng)級別的測試上;
那怎么進(jìn)行服務(wù)端接口級別的Mock呢,非常簡單,只需要兩個工具:
抓包工具Charles
Easy Mock
Charles是一款抓包工具,我們要用Charles做移動端APP的代理,目的是為了把Request路由到Easy Mock的接口上,得到我們的Mock數(shù)據(jù)。Easy Mock是一個可視化、能快速生成模擬數(shù)據(jù)的持久化服務(wù),正如其名,Easy Mock能使Mock變得非常簡單,令使用者愛不釋手。
下面開始進(jìn)入正題,Mock服務(wù)端接口的步驟如下:
1、Easy Mock創(chuàng)建接口Easy Mock有著非常友好的可視化界面,操作起來非常簡單。進(jìn)入Easy Mock官網(wǎng)后,首先創(chuàng)建一個項目,一個項目包含若干個接口,我們最終模擬的是接口。
(1)我們創(chuàng)建了一個命名為test的項目,如下圖,這個項目的基礎(chǔ)url是/api。
(2)接下來,創(chuàng)建接口,如下圖,左邊是我們想要構(gòu)造的接口返回的JSON數(shù)據(jù),右邊是這個接口的配置。
(3)將這個接口補(bǔ)充完成,如下圖,這個接口配置的URL是/index/v6,實際的URL就是/api/index/v6,也就是父路徑是這個接口所屬的項目的基礎(chǔ)URL。
(4)創(chuàng)建完成后,點(diǎn)擊預(yù)覽,這個接口就可以被訪問了,完整的URL是https://www.easy-mock.com/moc...,我們把最后的#!method=get去掉,依然可以正常訪問,所以這個URL就是我們的移動端APP應(yīng)該去請求的接口。
本次進(jìn)行Mock的場景是服務(wù)端接口已經(jīng)存在,但是數(shù)據(jù)不滿足要求,所以Response是通過Charles里的Copy Response復(fù)制到輸入框里,然后在這個基礎(chǔ)上做修改,這樣比完全創(chuàng)造Response要簡單得多。
現(xiàn)在, 要解決的問題就是怎么讓移動端APP的請求重定向到這個URL上,就可以得到我們想要的Mock數(shù)據(jù)了。
2、Charles修改路由(Map Remote)(1)我們把Charles設(shè)置成移動端APP的代理服務(wù)器,這樣可以攔截到請求,再借助Charles的Map Remote功能,就可以把請求重定向到我們的Easy Mock的URL上。
(2)我們用移動端APP來請求這個接口,通過Charles可以看到,移動端APP的請求URL從http://backend.test.env/api/i...://www.easy-mock.com/mock/5b6ce6ccbf1ebd4a1974c563/api/index/v6這個接口上,而我們的請求參數(shù)query都完整地帶著。
這樣,移動端APP就能收到我們的模擬數(shù)據(jù)了,通過修改Easy Mock的JSON,可以很輕松地Mock我們想要的數(shù)據(jù)。
在上面的方法中,我們是通過手動的方式修改Easy Mock的Response,實際上,Easy Mock還支持一些比較好的特性,可以引入在單元測試的自動化測試腳本中,比如:
Mock.js,支持生成隨機(jī)的數(shù)據(jù)、支持?jǐn)U展更多數(shù)據(jù)類型、支持自定義函數(shù)和正則;
支持基于Swagger創(chuàng)建項目,以節(jié)省手動創(chuàng)建接口的時間;
通過Easy Mock CLI可自動生成API;
支持通過請求對象編寫邏輯,實現(xiàn)響應(yīng)式數(shù)據(jù),支持自定義響應(yīng);
支持RESTful;
具體可移步到Easy Mock的官方文檔進(jìn)行查閱。
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://specialneedsforspecialkids.com/yun/8852.html
摘要:引言前端開發(fā)經(jīng)常需要等待后端的接口,嚴(yán)重影響了開發(fā)效率,我們一般采用方式來避免這個問題。可能會涉及到門技術(shù),分別是服務(wù)端技術(shù)隨機(jī)生成特定格式數(shù)據(jù)的技術(shù)請求轉(zhuǎn)發(fā)請求攔截。 引言 前端開發(fā)經(jīng)常需要等待后端的接口,嚴(yán)重影響了開發(fā)效率,我們一般采用mock方式來避免這個問題。本人參考了大量文章,結(jié)合自己的經(jīng)驗,給出自己在mock上的一些理解。 1. 原理 何為mock,我認(rèn)為mock主要就是通...
摘要:前端開發(fā)如何做好本地接口模擬之前有寫過一篇本地化接口模擬前后端并行開發(fā),講到過本地接口模擬,但不太細(xì)致。有哪些途徑本地接口模擬一般分為工具層面和代碼層面。因為本地接口模擬功能主要是針對的返回值為格式的異步請求,所以這種方式主要用文件。 前端開發(fā)如何做好本地接口模擬 之前有寫過一篇 本地化接口模擬、前后端并行開發(fā),講到過本地接口模擬,但不太細(xì)致。這次細(xì)細(xì)的說說本地接口模擬。 1. 有什么...
摘要:表示需要攔截的請求類型。添加信息攔截請求,調(diào)用函數(shù)先看一下這個是什么獲取信息更改后輸入標(biāo)題,點(diǎn)擊提交,再點(diǎn)擊獲取,可以看到返回了我們提交的數(shù)據(jù),并且是對象的形式,拿到數(shù)據(jù)后就可以做進(jìn)一步的操作了。 mock.js 官網(wǎng)地址:mockjs.com/ mockjs是用來模擬產(chǎn)生一些虛擬的數(shù)據(jù),可以讓前端在后端接口還沒有開發(fā)出來時獨(dú)立開發(fā)。我們可以使用真實的url,mockjs可以攔截ajax請求...
摘要:前后端的界限是按照瀏覽器和服務(wù)器的劃分。前后端彼此互不關(guān)聯(lián)。關(guān)于作者本文部分圖片段落參考文章實踐中的前后端分離。淘寶前后端分離實踐本文源碼詳見服務(wù)端代碼。 一、起源 (故事純屬虛構(gòu),如有雷同,純屬巧合)傳說在很久很久以前,我們有志之士有了個創(chuàng)業(yè)的想法,于是乎開始了自己的創(chuàng)業(yè)之夢,但是人手不足啊,于是乎所有角色老子一個人全包了: Roles: PM, DBA, RD, FED, Des...
閱讀 3265·2021-09-02 15:41
閱讀 2829·2021-09-02 09:48
閱讀 1368·2019-08-29 13:27
閱讀 1157·2019-08-26 13:37
閱讀 832·2019-08-26 11:56
閱讀 2479·2019-08-26 10:24
閱讀 1638·2019-08-23 18:07
閱讀 2615·2019-08-23 15:16