request-client

Install

npm i @kamuisdo/request-client --save

pnpm add @kamuisdo/request-client

Introduce

• 封装axios.request方法
• 提供统一的request client泛式，已相同的方式对接不同的服务端
• 统一业务错误和服务器响应失败(500)的逻辑
• 统一通知的处理
• 仅适用于HTTP及Https协议（与Axios的适用范围一致）

How to use

import { createClient } from '@kamuisdo/request-client'

const client = createClient({
	messageFn: console.log,
	axiosConfig: ()=>{
		return {
			baseURL:'/'
		}
	}
})

const mockClient = createClient({
	error: (response) => {
		const code = response?.data?.code
		return !(response && response.data && response.data.code === 0)
	},
	messageFn: console.log,
	axiosConfig: ()=>{
		return {
			baseURL:'/mock'
		}
	}
})

// 请求接口
client.getWhole({
	url: '/users/1',
	method: 'GET',
})

实例化RequestClient

在实际业务中一个RequestClient对应一个API服务，同一个API服务应该具有相同的业务处理逻辑，如errorCode、鉴权方式等。 实例化RequestClient参数说明如下

• data 可选，默认值'data'，用于指定如何从response中获取业务可用的数据
  • 可以是string类型，表示后台响应数据中业务数据的键值，如后端返回{ code:1, data: 'my name is Dan', message:'success' }，其中[data]是业务数据
  • 可以是function，将AxiosResponse作为方法的参数，需要返回业务数据
• error 可选，默认值'error'，用于指定如何判断响应是否成功，如入参错误时，接口响应成功(200)，但是请求失败（业务错误）
  • 可以是string类型，表示后台响应数据中是否成功数据的键值
  • 可以是function，将AxiosResponse作为方法的参数，需要返回Boolean
• message 可选，默认值'message'，用于指定如何从response中获取消息
  • 可以是string类型，表示后台响应数据中代表消息的键值
  • 可以是function，将AxiosResponse作为方法的参数，需要string类型，返回的值将显示在前端界面中
• messageFn 必选，用于指定通知的方式
  • message作为messageFn的参数，默认在响应失败及业务错误时调用messageFn方法来显示通知
  • 可以对单个接口配置ifSilenceErrorNotify=true来关闭通知
• defaultErrorMessage可选，用于指定默认的错误通知内容
  • string类型，在接口错误但是没有返回消息时显示的文本
• axiosConfig 必选，用于实例化AxiosInstance的参数，参考 https://github.com/axios/axios
  • function没有参数，返回的值会作为AxiosInstance的参数，在每次请求时都会重新执行从而获取最新的值

实例方法

发起请求的方法，在axios.request的参数的基础上，新增ifSilenceErrorNotify

type instanceOptions<Param> = AxiosRequestConfig<Param> & {
	ifSilenceErrorNotify?: boolean
}

• getWhole(instanceOptions)
  • 返回一个Promise，Promise中返回AxiosResponse（包含整个Request完整的信息）
• getData(instanceOptions)
  • 返回一个Promise，Promise中返回AxiosResponse.data（接口响应的完整数据）
• getBizData(instanceOptions)
  • 返回一个Promise，Promise中返回AxiosResponse.data中的业务数据（仅接口响应中的业务数据）
• getInstance()
  • 返回Axios实例