Skip to content
符合接口规范的 HTTP 客户端
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
dist
src
.esdoc.json
.gitignore
.travis.yml
CHANGELOG.md
LICENSE
README.md
babel.config.js
package-lock.json
package.json
rollup.config.js

README.md

standard-http-client

NPM version Build Status Coverage Status Known Vulnerabilities changelog license

npm-image

符合接口规范的 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 文档

You can’t perform that action at this time.