百度智能小程序 Mock

Mock

此功能在 3.6.0 之后版本可用。

開發(fā)者工具 3.6.0 以上的版本現(xiàn)在支持 Mock 接口功能，可以模擬部分小程序 api 的調(diào)用結(jié)果。

目前支持的 api 為 swan.request swan.downloadFile swan.uploadFile swan.getLocation swan.checkSession。

啟用 Mock 功能

在開發(fā)者工具的工具欄點擊 Mock 按鈕，即可進入 Mock 功能的管理頁面。

打開是否啟用 mock 的開關(guān)并選擇項目后，即可啟用 Mock 功能。啟用 Mock 功能后，小程序調(diào)用的 api 如果匹配到了 Mock 規(guī)則就會使用 Mock 數(shù)據(jù)返回結(jié)果。如果沒有匹配，會使用真實數(shù)據(jù)返回。

管理 mock 數(shù)據(jù)

點擊新建 mock 項目按鈕，新建一個 Mock 項目。

新建項目后會自動進入項目詳情頁。可以在詳情頁管理項目規(guī)則。每條規(guī)則對應(yīng)一個 api。目前支持的 api 為 swan.request swan.downloadFile swan.uploadFile?？赏ㄟ^下拉選擇。

過濾規(guī)則

可以通過過濾規(guī)則來過濾是否匹配 Mock 數(shù)據(jù)，如果過濾規(guī)則都通過的情況才會返回 Mock 數(shù)據(jù)。

過濾規(guī)則分為參數(shù)過濾和函數(shù)過濾。

參數(shù)過濾

可配置參數(shù)名和參數(shù)對應(yīng)的正則表達式來匹配調(diào)用 api 傳入的參數(shù)。可輸入多條參數(shù)過濾規(guī)則。

參數(shù)的正則表達式需要傳入正則表達式內(nèi)容的字符串。如想匹配 /abcd/，傳入 abcd 即可。

注意正則表達式中的特殊字符是需要轉(zhuǎn)義的。如相匹配 path 為 http://example.com/path/to/data?a=1 可以輸入 http:\/\/example\.com\/path\/to\/data\?a=1

對于對象類型的屬性，可以使用 

這里需要注意，函數(shù)類型的參數(shù)是匹配不到的。比如 success fail complete 等是不會匹配到參數(shù)的。

過濾函數(shù)

啟用過濾函數(shù)后可以通過函數(shù)來控制過濾規(guī)則。過濾函數(shù)返回 true 就說明匹配到了過濾規(guī)則，就會返回 mock 數(shù)據(jù)。當(dāng)然前提是已經(jīng)通過參數(shù)過濾規(guī)則的校驗。如果只想使用過濾函數(shù)而不使用參數(shù)過濾的話可以不寫過濾參數(shù)。

過濾函數(shù)的函數(shù)名需要為 filter。函數(shù)的參數(shù)為 api 去掉回調(diào)后的入?yún)ⅰ?/p>

比如下面的代碼

swan.request({
    url: 'https://www.baidu.com',
    data: {
        mock: 1
    },
    success(res) {
        console.log('success', res);
    },
    fail(err) {
        console.log('fail', err);
    }
});

入?yún)?/p>

{
	url: 'https://www.baidu.com',
    data: {
        mock: 1
    }
}

模擬返回

模擬返回可以控制返回的回調(diào) success 或 fail 。選擇后 mock 數(shù)據(jù)就會調(diào)用對應(yīng)的回調(diào)。

數(shù)據(jù)的生成方式有 JSON 和 Mock.js 兩種。

1. JSON

{
    "data": "",
    "statusCode": 200,
    "header": ""
}

2. Mock.js 格式數(shù)據(jù)

Mock.js 模板數(shù)據(jù)會有預(yù)覽數(shù)據(jù)展示。

Mock.js 語法

例如輸入

{
    "data": {
        "list|2": [{
            "id|+1": 0
        }]
    },
    "statusCode|200": 1,
    "header": ""
}

會在數(shù)據(jù)預(yù)覽中看到如下數(shù)據(jù)

{
    "data": {
        "list": [
            {
                "id": 0
            },
            {
                "id": 1
            }
        ]
    },
    "statusCode": 200,
    "header": ""
}