小程序 mock | DolphinHybrid

# 小程序 mock 接入规范

小程序采用全局接入yapi mock 的方案，前提条件是所有业务接口都已经配置了yapi

# 接入步骤

定义mock 变量

// /config.js
const config = {
  enviroment: 'prod',
  isMock: true,
  mockBaseUrl: 'https://yapi.smartmidea.net/mock/xxx'
}

1
2
3
4
5
6

在接口请求处，通过环境变量区分请求

// utils/requestService.js
import config from '/config.js'

var requestService = {
  request: (apiName, params, method, headerObj, timeout) => {
    return new Promise((resolve, reject) => {
      ...
      let apiObj = api[apiName]
      let url
      if (apiObj) {
        //已有接口配置
        if(config.enviorment !== 'prod' && config.isMock) {
          // 启用mock
          url = config.mockBaseUrl + apiObj.url
        } else {
          url = api.isMasEnv ? api[apiName].masUrl : api[apiName].url
        }
        
      } else {
        ...
      }
      wx.request({
        url: url,
        data: params,
        ...
        success(resData) {
          ...
        },
        fail(error) {
          ...
        }
      })
    })
  }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36

完成上述操作后，需求启用mock环境时，在config.js中的设置environment不为prod和isMock值为true即可。

# 补充情况

按需接入yapi (考虑到实际业务中，不一定满足全局接入yapi的情况)

在配置文件中配置不同的yapi源和对应源的开启条件

// /config.js
const config = {
  enviroment: 'prod',
  isMock: true, // 全局mock 开关
  mockBaseUrl: 'https://yapi.smartmidea.net/mock/xxx',
  // 多yapi源情况, 形参命名建议是按照接口服务功能命名，此处仅做示例
  mockBaseUrlSence:  'https://yapi.smartmidea.net/mock/xxx',
  openMockSence: false,
  mockBaseUrlCard:  'https://yapi.smartmidea.net/mock/xxx',
  openMockCard: false,
}

1
2
3
4
5
6
7
8
9
10
11

在接口文档中配置对应yapi源和启用判断

// /api/main/scene-api.js
  
  const api = {
    //场景id列表查询
    getSceneIdList: {
      ...
      api: '/v2/scene/id/list',
      openMock: 'openMockSence',
      mockOrigin: 'mockBaseUrlSence'
    },
  }
  export default api

1
2
3
4
5
6
7
8
9
10
11
12

在请求方法中，判断是否为接口请求yapi服务

// utils/requestService.js
import config from '/config.js'

var requestService = {
  request: (apiName, params, method, headerObj, timeout) => {
    return new Promise((resolve, reject) => {
      ...
      let apiObj = api[apiName]
      let url
      if (apiObj) {
        //已有接口配置
        if(config.enviorment !== 'prod' && config.isMock &&
          apiObj.openMock && api.mockOrigin &&
          config[apiObj.openMock] && config[apiObj.mockOrigin]) {
          // 启用mock
          url = config[apiObj.mockOrigin] + apiObj.url
        } else {
          url = api.isMasEnv ? api[apiName].masUrl : api[apiName].url
        }
        
      } else {
        ...
      }
    })
  }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27