支付寶小程序 Anymock 場景數(shù)據(jù)平臺擴展

2020-09-16 16:08 更新

Anymock 是一個高效、易用的數(shù)據(jù)接口平臺,旨在為開發(fā)、測試、設(shè)計同學(xué)提供功能強大的接口 Mock 及接口管理服務(wù)。

Anymock 小程序開發(fā)者工具(簡稱 IDE)擴展,為 IDE 提供了 mock 任意一個 JSAPI 的能力。同時,我們提供了真機預(yù)覽的 mock 能力,即小程序在真機上預(yù)覽時也可以使用 Anymock 的 mock 數(shù)據(jù)。

安裝 Anymock 擴展:

1. 前提條件:下載小程序開發(fā)者工具

下載并安裝 小程序開發(fā)者工具(簡稱 IDE)。

2. 安裝 Anymock 擴展

打開小程序開發(fā)者工具,打開一個支付寶小程序進入編輯器窗口,在左側(cè)工具欄點擊擴展市場圖標(biāo),搜索 Anymock,進行安裝。

image

使用 Anymock 擴展

1. 啟用 Anymock

安裝 Anymock 擴展之后可以在頂部菜單欄右側(cè)發(fā)現(xiàn) Anymock 的入口圖標(biāo),點擊它打開配置面板,打開 開啟 Anymock 開關(guān)。 image

2. 設(shè)置項目 Token

Anymock 功能使用依賴于項目 Token(注意請勿泄露給他人)。在Anymock 平臺的項目列表中可直接點擊復(fù)制項目 Token,并粘貼到上圖擴展配置頁面的 項目 Token 一項中。您也可以在 Anymock 平臺的項目 Workspace 進行項目 Token 的查看、復(fù)制和重置。 image

Anymock 快速上手:

1. 新建項目

image

2. 項目 workspace 介紹

可以在 Anymock 平臺上創(chuàng)建項目/接口/數(shù)據(jù),小程序 IDE 里就可以直接消費了。關(guān)于 Anymock 平臺能力請參考 官方文檔。 image

3. 使用 mock 數(shù)據(jù)

在使用 IDE 開發(fā)小程序過程中,代碼層面不需要做任何感知就可以使用 Anymock,可以在 DevTool 里看到打印的 Anymock 日志。Anymock 平臺中的數(shù)據(jù)支持函數(shù)編程、MockJs等特性,方便開發(fā)者使用,詳情請參考 官方文檔。

注意:沒有命中 mock 數(shù)據(jù)的接口,會自動走原生鏈路返回。

在Anymock 平臺編寫 mock 數(shù)據(jù) image

在項目里調(diào)用 my.request 接口,會得到 Anymock 對應(yīng)接口的返回值

my.request({
   url: 'http://httpbin.org/get',
   method: 'GET',
   data: {
     from: '支付寶',
     name: '支小寶',
   },
   dataType: 'json',
   complete: function(res) {
     console.log('complete:', res);
     my.alert({ content: JSON.stringify(res)});
   }
 });

比如之前的返回值是:

{
  "success": true,
  "name": "Hi HTTP GET"
}

在調(diào)試器里可看到對應(yīng)的返回值: image

在 Anymock 里修改這個返回值,請求的響應(yīng)就會修改。

其他

Anymock 的初衷是讓開發(fā)者無感知地使用 Mock 數(shù)據(jù)。我們?yōu)?a rel="external nofollow" target="_blank" target="_blank"> 小程序開發(fā)者工具、Google Chrome 等提供了官方插件,開發(fā)者在這些研發(fā)環(huán)境下無需做任何代碼改動,就可以輕松使用 Anymock 提供的服務(wù)。

反饋

? Anymock 官方網(wǎng)站

? Anymock 官方文檔

? Anymock 官方討論區(qū)

? Anymock 官方答疑釘釘群:

image

以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號