mock

Mock介紹

YApi的 Mock 功能可以根據用戶的輸入接口信息如協議、URL、接口名、請求頭、請求參數、返回數據（[返回數據](#mock)）生成 Mock 接口，這些接口會自動生成模擬數據，創建者可以自由構造需要的數據。

mock地址解析：YApi平台網址 + mock + 您的項目id + 接口實際請求path

假設你 YApi 的部署地址為：http://yapi.xxx.com 然后用這個地址作為示例

mockd 地址： http://yapi.xxx.com/mock/29/api/hackathon/login

注：項目 id 可以在項目設置里查看到

定義 mock 數據示例

項目 -> 接口編輯 -> 返回數據設置

返回數據設置有兩種方式，最新版本默認是基於 json+注釋 的方式，另外一種是基於 json-schema 定義數據結構,請根據實際情況靈活選擇使用。

方式1. mockjs

原理

基於 mockjs，跟 Mockjs 區別是 yapi 基於 json + 注釋 定義 mock 數據，無法使用 mockjs 原有的函數功能。

1. 正則表達式需要基於 rule 書寫，示例如下：

{
  "name|regexp": "[a-z0-9_]+?",
  "type|regexp": "json|text|xml"
}

2. 支持替換請求的 query, body 參數

{
  "name": "${query.name}", //請求的url是/path?name=xiaoming, 返回的name字段是xiaoming
  "type": "${body.type}",   //請求的requestBody type=1,返回的type字段是1
  
}

3. 示例

/**
 * 這是一個接口返回數據示例
 */

{
    "errcode": 0,
    "errmsg": "@word",
    "data": {
        "id": "@id", //@id 隨機生成 id
        "name": "@name" //@name 隨機生成用戶名
    }
}

詳細使用文檔請查看：Mockjs 官網

方式2. json-schema

開啟 json-schema 功能后，根據 json-schema 定義的數據結構，生成隨機數據。

如何生成隨機的郵箱或 ip(該方法在v1.3.22之后不再適用)？

點擊高級設置，選擇 format 選項，比如選擇 email 則該字段生成隨機郵箱字符串。

集成 mockjs

基本書寫方式為 mock 的數據占位符@xxx, 具體字段詳見Mockjs 官網  

如果不是以@字符開頭的話或者匹配不到Mockjs中的占位符就會直接生成輸入的值

如何使用 Mock

1 在 js 代碼直接請求yapi提供的 mock 地址（不用擔心跨域問題）

在代碼直接請求 yapi 提供的 mock 地址，以 jQuery 為例：

let prefix = 'http://yapi.xxx.com/mock/2817' $.post(prefix+'/baseapi/path', {username: 'xxx'}, function(res){ console.log(res) //返回上圖預覽部分的數據 }) 

2 基於本地服務器反向代理

優點:不用修改項目代碼

2.1 基於 nginx 反向代理

location /baseapi { proxy_pass http://yapi.xxx.com/mock/2817/baseapi; #baseapi后面沒有"/" } 

2.1 基於 Charles 代理

點擊 Charles 工具欄下的 tools >> Rewrite Settings 填寫如下信息：

mock請求嚴格模式

版本 v1.3.22 新增 mock 接口請求字段參數驗證功能，具體使用方法如下：

1. 打開 項目 -> 設置 開啟 mock 嚴格模式

2. 針對 query, form 中設置的必須字段會進行必填校驗 

3. 針對 req_body_type 是json schema 格式的數據進行校驗