AJAX

一个 HTTP 库,底层是 axios 和 XMLHttpRequest,封装的目的是统一管理请求。

1. 如何使用

  • 拦截请求和响应
  • 转换请求和响应数据

    2. 能力特性

  • 请求等待动画

  • get 请求
  • post 请求
  • 加签、加密、压缩
  • 错误提示
  • 结果 json 统一转换
  • 同步、异步
  • 打印类接口控制

常见应用方式

  1. // 于业务代码中截取的代码段
  2. getDefaultValues() {
  3. let defaultValues = {};
  4. ajax({
  5. url: '/nccloud/price/adjustprice/quickdefaultvalue.do',
  6. data: {
  7. pk_org: this.props.form.getFormItemsValue(ADJUSTPRICE_CONST.formId, 'pk_org').value,
  8. pk_tariffdef: this.props.form.getFormItemsValue(ADJUSTPRICE_CONST.formId, 'pk_tariffdef').value
  9. },
  10. async: false,
  11. success: (res) => {
  12. let { success, data } = res;
  13. if (success) {
  14. defaultValues = data;
  15. }
  16. }
  17. });
  18. return defaultValues;
  19. }

3. API

ajax({
    url,
    method,
    data,
    async,
    loading,
    print,
    success,
    error,
    params,
    from,
    mode,
    headers,
    delayTime,
    windowContainer,
    loadingContainer,
    toastContainer,
    sysParameter,
    requestJSON
});

3.1 config

config 的 参数说明

参数 说明 类型 默认值 备注
url 于请求的服务器 URL String ‘/‘ 必填
method 创建请求时使用的方法 String ‘post’
data 作为请求主体被发送的数据 {}
async 是否异步 Boolean true
loading 是否遮罩 Boolean true
print 是否打印接口 Boolean false
success 请求成功回调 Function 见下一章节
error 请求报错回调 Function 见下一章节
params 与请求一起发送的 URL 参数 Object {} 必须是无格式对象(plain object)或 URLSearchParams 对象
from 系统参数 String ‘’
mode 系统参数 String ‘’
headers 即将被发送的自定义请求头 Object { ‘Content-Type’: ‘application/json;charset=UTF-8’ }
delayTime loading 最低时长 1000
windowContainer 容器 Object window
loadingContainer loading 容器 DOM \ ReactComponent \ ReactDOM DOM[div]
sysParameter 系统参数,会被合并到data Object
requestJSON false 丢弃

3.2 error & success

success 默认方法
function (res) { console.log(res); }
error 默认方法
function (res, url) { console.error(res); let msgContent = JSON.stringify(res.message); toast({ color: ‘danger’, content: msgContent, container: toastContainer, mark: msgContent + url }); }

4. 注意事项

通常情况下,不建议混合使用其他 HTTP 库,会产生版本升级不同步问题