api多域名mock

在数据mock一节讲述了如何进行api数据的mock，但是只局限于所有api请求都是相同域名的情况，工作中可能出现一个项目请求多个域名的api接口，本节将讲解如和进行多域名的mock。

1 版本要求

  • chameleon-tool >= 0.2.0-alpha.0
  • chameleon-api >= 0.3.0-alpha.4

2 chameleon.config.js中配置多域名信息

domain对象配置多域名的信息。domain, Object 类型。配置在base对象中，可以作为所有平台的公共配置，dev模式中配置的localhost会替换成当前dev模式启动的web服务ip+端口。 具体使用文档参见api多域名mock

例如：

  1. cml.config.merge({
  2.   base: {
  3.     dev: {
  4.       domain: {
  5.         domain1: "localhost",
  6.         domain2: "localhost"
  7.       },
  8.     },
  9.     build: {
  10.       domain: {
  11.         domain1: "http://api.cml.com",
  12.         domain2: "http://api2.cml.com"
  13.       },
  14.     }
  15.   },
  16. })

3 使用 chameleon-api 发网络请求

chameleon-api的网络请求get、post、request方法中添加domain参数。chameleon.config.js中添加的domain对象配置，在项目中可以通过process.env.domain变量访问。

例如：

  1. import cml from "chameleon-api";
  2. cml.get({
  3.   domain: process.env.domain.domain1
  4.   url: '/api/getMessage'
  5. })
  6. .then(res => {
  7.   cml.showToast({
  8.     message: JSON.stringify(res),
  9.     duration: 2000
  10.   })
  11. }, 
  12. err => {
  13.   cml.showToast({
  14.     message: JSON.stringify(err),
  15.     duration: 2000
  16.   })
  17. });

4 配置mock数据

前两步操作实现了网络请求dev模式请求本地，build模式请求线上，这一步就讲解如何mock本地多域名的请求数据。

在/mock/api/文件夹下创建mock数据的js文件。文件内容格式如下：

  2. module.exports = [{
  3.   domainKey: 'domain1',
  4.   request: [
  5.     {
  6.       method: ['get', 'post'],
  7.       path: '/api/getMessage',
  8.       controller: function (req, res, next) {
  9.         res.json({
  10.           total: 0,
  11.           message: [{
  12.             name: 'Hello chameleon! domain1'
  13.           }]
  14.         });
  15.       }
  16.     }
  17.   ] 
  18. },
  19. {
  20.   domainKey: 'domain2',
  21.   request: [
  22.     {
  23.       method: ['get', 'post'],
  24.       path: '/api/getMessage',
  25.       controller: function (req, res, next) {
  26.         res.json({
  27.           total: 0,
  28.           message: [{
  29.             name: 'domain2!'
  30.           }]
  31.         });
  32.       }
  33.     }
  34.   ] 
  35. }]
  • domainKey 指定mock的域名，对应chameleon.config.js中domain对象的key值。
  • method指定请求方法，默认值['get','post']
  • path指定请求的路径
  • controller 是express的中间件形式，在中间件中可以做任何操作最后调用res的方法返回结果。