@xsyx/easy-api-h5

api 使用手册

完整规范请参考 https://www.yuque.com/xsued/book/lz3qo4

1. 初始化

// import EasyApi from '@xsyx/easy-api-h5'; // 这种也可以
import { registerModule } from '@xsyx/easy-api-h5';


export const commonApi = registerModule({
  prefix: 'http://test.xsts.xyz', // 请求的统一前缀
  module:{}, // 请求的接口基本信息，见 「module 配置规范」
  loading: true,//全局的loading
  // 以下皆为可选项
  mock: true, // 是否使用mock，全局有效（可选项）
  timeout: 15* 1000, // 超时时间
  // 标准化返回格式，如果响应格式不符合规范，则通过该函数进行标准化，
  // success 为 false 的返回将会走到 exception 
  standard: (response)=>{ // easeApi 接受的标准是 { data, code, success: true/false, message}; 
    const {rspCode, data, rspDesc} = response
      return {
          code: rspCode,
          success: rspCode === 'success', // code === '200'
          data: data,
          message: rspDesc
      }
  }, 
  headers: {// 全局头部（可选项）
  	Authorization: async function(){// 可为函数
			return await kylinApi.getToken();
		}
  }, 
  hooks:{ // 全局钩子（可选项）
    afterFetch:[
    	(url, response, params, options)=>{
      	console.log(response)
      }
    ],
    beforeFetch:[
    	(url, response, params, options)=>{
      	console.log(response)
      }
    ]
  },
  plugins:{ // 注册吐司消息插件和加载动画插件（可选项）
    toast(option){
      const instance = Message.info(option);
      return ()=>{ // 返回一个用来关闭弹窗的方法
        instance.close();
      }
    }
    loading(options){
    	Loading.service(options)
    }
  }
})

1. 在 modules 中配置接口基本信息

   • url 接口地址
   • method 请求方式
   • 更多配置

   export default {
     // 一个简单的url 配置
     fetchSomeData: {
       // 完整的访问方法名
       url: "/sample/data/normal", // 请求的地址（必填）
       // 以下皆为可选项
       mockUrl: "/mock/data/normal", // mock 地址（可选项）
       mockData: { rspCode: "success", data: [] }, // 静态 mock 数据
       cached: "5000", // 表示接口在多久以内，缓存临时数据（可选项）
       sensitive: "11", // 灵敏期，在这个时间段内，不会走缓存
       method: "POST", // 请求方法 post get（可选项）
       concurrency: false, // 是否允许并发（可选项）
       mock: false, // 是否访问 mock（可选项）， 若配置了全局mock 则仍然根据子项生效
       fit: (rsp, params) => {
         // 拦截返回数据格式化
         return rsp;
       },
       repeat: 3, // 重试次数
       feed: (rsp, params) => {
         // 补偿机制，如果重试无效，则进入兜底返回
         // 补偿机制
       },
       fail(rsp, params) {
         // 全局错误处理
       },
     },
   };
   

2. 在 api.js 中注册对应的模块，同时导出。

   • 导出的变量名，既是最终使用时调用的名字。
   • 如： api.brandHouse.fetch1(params, options)
   • 其中 brandHouse 就是 模块名
   • params 就是传给服务端的数据,例如

   //服务端支持json数据,直接传json数据，不用修改请求header
   api.brandHouse.fetch1(
     {
       bcd: 123,
       abc: 1344,
     },
     options
   );
   //若服务端不支持json数据, 直接在headers 中修改 content type
   // 该配置同样可以在 全局配置中生效
   api.brandHouse.fetch1(
      {a: 1 b:2},
      {
        headers: {
          'Content-Type': 'application/x-www-form-urlencoded'
        }
      }
   );
   

   • options 包含如下两个参数
   • loading false string|bool|object
   • silence false bool 是否在出错的时候静默