standard-http-client
符合接口规范的 HTTP 客户端(基于 axios)
功能
主要功能
- 遵循接口规范, 当接口调用成功时才会执行
resolve
,resolve
时可以便捷地获取到接口规范中的业务数据 - 规范化请求的错误处理, 生成标准的错误码, 并输出错误日志
error._desc
错误分类的描述, 例如:接口调用出错
error._errorType
错误分类, 例如:H
error._errorNumber
错误编号, 例如:404
error._errorCode
错误码, 例如:H404
- 预留扩展机制, 便于实现定制需求(例如统一开启/关闭 loading)
次要功能
- 扩展 axios 的配置项
_jsonp
: 通过 JSONP 机制发送请求, 并支持和 axios 兼容的参数和拦截器 - 扩展 axios 的配置项
_data
: 实现类似 jQuery.ajax 的 data 配置项机制
示例
发送请求
import StandardHttpClient from 'standard-http-client';
var httpClient = new StandardHttpClient({ // instance axios Request Config
withCredentials: true,
timeout: 10000
});
httpClient.send({ // axios Request Config
url: 'https://domain.com/path/to/api'
}).then(function([data, response]) {
// 注意: 这里的 data 是接口规范中的 data 字段, 即接口返回的业务数据
console.log(data);
});
// 通过 JSONP 发送请求
httpClient.send({
url: 'https://domain.com/path/to/api',
_jsonp: true
}).then(function([data, response]) {
console.log(data);
});
// 通过 _data 发送数据更便捷
httpClient.send({
url: 'https://domain.com/path/to/api',
_data: {
foo: 'bar'
}
}).then(function([data, response]) {
console.log(data);
});
hook 机制
import StandardHttpClient from 'standard-http-client';
class HttpClient extends StandardHttpClient {
constructor(config) {
super(config);
}
beforeSend(config) {
console.log('before send', config);
}
afterSend(responseOrError) {
console.log('after send', responseOrError);
}
handleError(error) {
console.log('handle error', error);
}
}
var httpClient = new HttpClient({ // instance axios Request Config
withCredentials: true,
timeout: 10000
});
httpClient.send({ // axios Request Config
url: 'https://domain.com/path/to/api'
}).then(function([data, response]) {
console.log(data);
});
参考实现: shc-pc
扩展拦截器
import StandardHttpClient from 'standard-http-client';
class HttpClient extends StandardHttpClient {
constructor(config) {
super(config);
}
useInterceptors() {
super.useInterceptors();
// this.agent is an instance of axios
this.agent.interceptors.request.use(function(config) {
console.log('HttpClient request config', config);
return config;
}, function (error) {
console.log('HttpClient request error', error);
return Promise.reject(error);
});
this.agent.interceptors.response.use(function(response) {
console.log('HttpClient response', response);
return response;
}, function(error) {
console.log('HttpClient response error', error);
return Promise.reject(error);
});
}
}
var httpClient = new HttpClient({ // instance axios Request Config
withCredentials: true,
timeout: 10000
});
httpClient.send({ // axios Request Config
url: 'https://domain.com/path/to/api'
}).then(function([data, response]) {
console.log(data);
});
详见 API 文档