封装ajax

import Logger from "./Logger"; //日志
import superagent from "superagent"; //superagent
import globalConfig from "../config"; //config.js

const logger = new Logger("Ajax"); //日志组件

/**
 * 封装所有ajax逻辑, 为了配合 async/await, 所有ajax请求 都要返回promise对象
 */
class Ajax {
  //Ajax组件

  // Ajax工具类提供的方法可以分为2种:
  // 1. 基础的get/post方法, 这些是通用的
  // 2. 在get/post基础上包装的业务方法, 比如getCurrentUser, 这些方法是有业务含义的

  // 作为缓存
  tableCache = new Map();

  /**
   * 内部方法, 在superagent api的基础上, 包装一些全局的设置
   *
   * @param method 要请求的方法
   * @param url 要请求的url
   * @param params url上的额外参数
   * @param data 要发送的数据
   * @param headers 额外设置的http header
   * @returns {Promise}
   */
  requestWrapper(method, url, { params, data, headers } = {}) {
    logger.debug(
      "method=%s, url=%s, params=%o, data=%o, headers=%o",
      method,
      url,
      params,
      data,
      headers
    );
    return new Promise((resolve, reject) => {
      const tmp = superagent(method, url);
      // 是否是跨域请求
      if (globalConfig.isCrossDomain()) {
        tmp.withCredentials();
      }
      // 设置全局的超时时间
      if (globalConfig.api.timeout && !isNaN(globalConfig.api.timeout)) {
        tmp.timeout(globalConfig.api.timeout);
      }
      // 默认的Content-Type和Accept
      tmp
        .set("Content-Type", "application/x-www-form-urlencoded")
        .set("Accept", "application/json");
      // 如果有自定义的header
      if (headers) {
        tmp.set(headers);
      }
      // url中是否有附加的参数?
      if (params) {
        tmp.query(params);
      }
      // body中发送的数据
      if (data) {
        tmp.send(data);
      }
      // 包装成promise
      tmp.end((err, res) => {
        logger.debug("err=%o, res=%o", err, res);
        // 我本来在想, 要不要在这里把错误包装下, 即使请求失败也调用resolve, 这样上层就不用区分"网络请求成功但查询数据失败"和"网络失败"两种情况了
        // 但后来觉得这个ajax方法是很底层的, 在这里包装不合适, 应该让上层业务去包装
        if (res && res.body) {
          resolve(res.body);
        } else {
          reject(err || res);
        }
      });
    });
  }

  // 基础的get/post方法
  get(url, opts = {}) {
    //被底下调用了
    return this.requestWrapper("GET", url, { ...opts }); //调用上面的requestWrapper方法
  }

  post(url, data, opts = {}) {
    return this.requestWrapper("POST", url, { ...opts, data }); //调用上面的requestWrapper方法
  }

  myRegisterPost(jiekou, data) {
    const headers = { "Content-Type": "application/json" };
    return this.post(`${globalConfig.getAPIPath()}` + jiekou, data, {
      headers
    });
  }

  myPost(jiekou, data) {
    var c = `${globalConfig.getAPIPath()}`; //globalConfig config.js里的方法 getAPIPath
    const headers = { "Content-Type": "application/json" };
    return this.post(c + jiekou, data, { headers }); //c 服务器地址 拼接接口 data 参数 请求头{'Content-Type': 'application/json'}
  }
  myGet(jiekou, data) {
    var c = `${globalConfig.getAPIPath()}`;
    const headers = { "Content-Type": "application/json" };
    return this.get(c + jiekou, data, { headers });
  }

  // 业务方法

  /**
   * 获取当前登录的用户
   *
   * @returns {*}
   */
  getCurrentUser() {
    var url = `${globalConfig.getAPIPath()}` + "/users/current/get";
    return this.get(url);
  }

  /**
   * 用户登录
   *
   * @param username
   * @param password
   */
  login(username, password) {
    const headers = { "Content-Type": "application/json" };
    var url =
      `${globalConfig.getAPIPath()}` +
      "/users" +
      `${globalConfig.login.validate}`;
    return this.post(url, { username, password }, { headers });
  }

  logOutPost(jiekou, data) {
    var url = `${globalConfig.getAPIPath()}`;
    const headers = { "Content-Type": "application/json" };
    return this.get(url + jiekou, data, { headers });
  }

  //0.请求训练任务信息
  getTraintask() {
    var url = `${globalConfig.getAPIPath()}` + "/services/list";
    return this.get(url);
  }
  //1.配置环境变量
  peizhihuan(model_name, api_type, project_id, training_id) {
    const headers = { "Content-Type": "application/json" };
    var url = `${globalConfig.getAPIPath()}` + "/services/env/config";
    // var project_id = 1;                      //项目ID
    // var training_id = 10;                    //训练ID
    var service_type = "MODEL"; //服务类型 这儿得是字符串
    var persistence = 0;
    return this.post(
      url,
      {
        model_name,
        api_type,
        project_id,
        service_type,
        training_id,
        persistence
      },
      { headers }
    );
  }
  //4.上传model_name.py代码文件
  shangchuanm(service_name, model_name) {
    const headers = { "Content-Type": "application/json" };
    var url = `${globalConfig.getAPIPath()}` + "/services/code/upload";
    return this.post(
      url + "?service_name=" + service_name + "&model_name=" + model_name,
      { service_name, model_name },
      { headers }
    );
  }
  //5.编辑生成依赖requirements.txt文件      部署服务     合二为一
  bianjisheng(requirements, service_name, model_name, api_type, training_id) {
    const headers = { "Content-Type": "application/json" };
    var url = `${globalConfig.getAPIPath()}` + "/services/deploy";
    // var training_id = 10;                    //训练ID
    return this.post(
      url,
      { requirements, service_name, model_name, api_type, training_id },
      { headers }
    );
  }
  //7.查询服务状态
  zhuangtai(service_id) {
    var url = `${globalConfig.getAPIPath()}` + "/services/deploy/status";
    return this.get(url + "?service_id=" + service_id);
  }
  //8.查看服务信息
  chakanfu(service_id) {
    var url = `${globalConfig.getAPIPath()}` + "/services/info";
    return this.get(url + "?service_id=" + service_id);
  }
  //9.获取服务列表                            //姐写好的
  getServiceList() {
    var url = `${globalConfig.getAPIPath()}` + "/services/list";
    return this.get(url);
  }
  //获取训练任务列表
  getServicesList() {
    var url = `${globalConfig.getAPIPath()}` + "/services/list";
    return this.get(url);
  }
  //10.删除服务
  shanchufu(service_id) {
    const headers = { "Content-Type": "application/json" };
    var url = `${globalConfig.getAPIPath()}` + "/services/delete";
    return this.post(url, { service_id }, { headers });
  }
  //11.获取部署报错信息
  getBaocuoList(service_id) {
    var url = `${globalConfig.getAPIPath()}` + "/services/deploy/error";
    return this.get(url + "?service_id=" + service_id);
  }
  //12.训练任务-检查模型是否存在
  trainTask(project_id) {
    var url = `${globalConfig.getAPIPath()}` + "/training/model/exist/check";
    return this.get(url + "?project_id=" + project_id);
  }
  //13.框架环境列表
  //31.训练任务 提交训练
  trainTasksubmit(project_id, gpu, image_id) {
    const headers = { "Content-Type": "application/json" };
    var url = `${globalConfig.getAPIPath()}` + "/training/task/submit";
    return this.post(url, { project_id, gpu, image_id }, { headers });
  }
  //编程式提交 tfjobs     
  trainTasksubmits(
    project_id,
    ps_replicas,
    ps_gpu,
    worker_replicas,
    worker_gpu,
    start_cmd,
    image_id
  ) {
    const headers = { "Content-Type": "application/json" };
    var url = `${globalConfig.getAPIPath()}` + "/training/task/submit";
    return this.post(
      url,
      {
        project_id,
        ps_replicas,
        ps_gpu,
        worker_replicas,
        worker_gpu,
        start_cmd,
        image_id
      },
      { headers }
    );
  }
  //编程式提交 caffe
  trainTasksubmitss(project_id, gpu, start_cmd, image_id) {
    const headers = { "Content-Type": "application/json" };
    var url = `${globalConfig.getAPIPath()}` + "/training/task/submit";
    return this.post(
      url,
      { project_id, gpu, start_cmd, image_id },
      { headers }
    );
  }
  //编程式提交 caffe2jobs
  trainTasksubmitsss(
    project_id,
    worker_replicas,
    worker_gpu,
    start_cmd,
    image_id
  ) {
    const headers = { "Content-Type": "application/json" };
    var url = `${globalConfig.getAPIPath()}` + "/training/task/submit";
    return this.post(
      url,
      { project_id, worker_replicas, worker_gpu, start_cmd, image_id },
      { headers }
    );
  }
  //编程式提交 pytorchjobs
  trainTasksubmitssss(
    project_id,
    master_gpu,
    master_replicas,
    worker_gpu,
    worker_replicas,
    start_cmd,
    image_id
  ) {
    const headers = { "Content-Type": "application/json" };
    var url = `${globalConfig.getAPIPath()}` + "/training/task/submit";
    return this.post(
      url,
      {
        project_id,
        master_gpu,
        master_replicas,
        worker_gpu,
        worker_replicas,
        start_cmd,
        image_id
      },
      { headers }
    );
  }
  //31.测评 跟训练任务一样
  trainTasksubmita(project_id, gpu, image_id) {
    const headers = { "Content-Type": "application/json" };
    var url = `${globalConfig.getAPIPath()}` + "/testing/test/submit";
    return this.post(url, { project_id, gpu, image_id }, { headers });
  }
  //编程式提交 tfjobs    
  trainTasksubmitsa(
    project_id,
    ps_replicas,
    ps_gpu,
    worker_replicas,
    worker_gpu,
    start_cmd,
    image_id
  ) {
    const headers = { "Content-Type": "application/json" };
    var url = `${globalConfig.getAPIPath()}` + "/testing/test/submit";
    return this.post(
      url,
      {
        project_id,
        ps_replicas,
        ps_gpu,
        worker_replicas,
        worker_gpu,
        start_cmd,
        image_id
      },
      { headers }
    );
  }
  //编程式提交 caffe
  trainTasksubmitssa(project_id, gpu, start_cmd, image_id) {
    const headers = { "Content-Type": "application/json" };
    var url = `${globalConfig.getAPIPath()}` + "/testing/test/submit";
    return this.post(
      url,
      { project_id, gpu, start_cmd, image_id },
      { headers }
    );
  }
  //编程式提交 caffe2jobs
  trainTasksubmitsssa(
    project_id,
    worker_replicas,
    worker_gpu,
    start_cmd,
    image_id
  ) {
    const headers = { "Content-Type": "application/json" };
    var url = `${globalConfig.getAPIPath()}` + "/testing/test/submit";
    return this.post(
      url,
      { project_id, worker_replicas, worker_gpu, start_cmd, image_id },
      { headers }
    );
  }
  //编程式提交 pytorchjobs
  trainTasksubmitssssa(
    project_id,
    master_gpu,
    master_replicas,
    worker_gpu,
    worker_replicas,
    start_cmd,
    image_id
  ) {
    const headers = { "Content-Type": "application/json" };
    var url = `${globalConfig.getAPIPath()}` + "/testing/test/submit";
    return this.post(
      url,
      {
        project_id,
        master_gpu,
        master_replicas,
        worker_gpu,
        worker_replicas,
        start_cmd,
        image_id
      },
      { headers }
    );
  }

  //33.训练任务 停止任务
  stops(project_id, run_id) {
    const headers = { "Content-Type": "application/json" };
    var url = `${globalConfig.getAPIPath()}` + "/training/task/stop";
    return this.post(url, { project_id, run_id }, { headers });
  }

  //57.上传数据集
  shangchuanshu(name) {
    const headers = { "Content-Type": "application/json" };
    var url = `${globalConfig.getAPIPath()}` + "/datasets/upload";
    return this.post(url, { name }, { headers });
  }
  /**
   *  封装CRUD相关操作
   *
   * @param tableName 要操作的表名
   * @returns {*}
   */
  CRUD(tableName) {
    //要操作的表名
    if (this.tableCache.has(tableName)) {
      return this.tableCache.get(tableName);
    }

    const util = new CRUDUtil(tableName);
    util.ajax = this;
    this.tableCache.set(tableName, util);
    return util;
  }
}

/**
 * 封装CRUD相关操作, 有点内部类的感觉
 */
class CRUDUtil {
  //CRUDUtil组件
  constructor(tableName) {
    this.tableName = tableName;
  }

  /**
   * 查询某个表
   *
   * @param queryObj 查询条件封装为一个对象
   * @returns {*}
   */
  select(queryObj) {
    return this.ajax.post(
      `${globalConfig.getAPIPath()}/${this.tableName}/select`,
      queryObj
    );
  }

  /**
   * 给某个表新增一条数据
   *
   * @param dataObj 要新增的数据
   * @returns {*}
   */
  insert(dataObj) {
    return this.ajax.post(
      `${globalConfig.getAPIPath()}/${this.tableName}/insert`,
      dataObj
    );
  }

  /**
   * 更新某个表的数据, 可以批量, 也可以单条
   *
   * @param keys 要更新的记录的主键
   * @param dataObj 要更新哪些字段
   * @returns {*}
   */
  update(keys = [], dataObj) {
    const tmp = keys.join(",");
    return this.ajax.post(
      `${globalConfig.getAPIPath()}/${this.tableName}/update`,
      dataObj,
      { params: { keys: tmp } }
    );
  }

  /**
   * 删除某个表的数据, 可以批量, 也可以单条
   *
   * @param keys 要删除的记录的主键
   * @returns {*}
   */
  delete(keys = []) {
    const tmp = keys.join(",");
    return this.ajax.get(
      `${globalConfig.getAPIPath()}/${this.tableName}/delete`,
      { params: { keys: tmp } }
    );
  }

  /**
   * 从服务端获取某个表的schema, 会merge到本地的schema中
   *
   * @returns {*}
   */
  getRemoteSchema() {
    return this.ajax.get(
      `${globalConfig.getAPIPath()}/${this.tableName}/schema`
    );
  }
}

export default Ajax;

  

  //调用ajax
  import ajax from "../../../../../utils/ajax";
  async getTaskList() {
    var ressb = await ajax.myGet(
      "business/data_center_businesses?data_center=" + 0
    );
    this.setState({
      serviceSystemList: ressb.data
    });
    //----------------------------------------
    var ressc = await ajax.myGet(
      "resource/floating_ips?data_center=" +
        0 +
        "&business=" +
        "all_business" +
        "&os_type=" +
        0
    ); //主页面列表接口
    this.setState({ vmListac: ressc.data });
    var data = [];
    for (var i = 0; i < this.state.vmListac.length; i++) {
      var elem = {
        business: this.state.vmListac[i].business,
        dataCenter: this.state.vmListac[i].dataCenter,
        id: this.state.vmListac[i].id,
        free: this.state.vmListac[i].free,
        ip: this.state.vmListac[i].ip,
        ipId: this.state.vmListac[i].ipId,
        ipInstanceId: this.state.vmListac[i].ipInstanceId,
        ostype: this.state.vmListac[i].ostype,
        partition: this.state.vmListac[i].partition,
        pool: this.state.vmListac[i].pool,
        virtualMachineIp: this.state.vmListac[i].virtualMachineIp
      };
      data.push(elem);
    }
    this.setState({
      dataSources: data
    });

        var ressa = await ajax.myGet(
          "resource/floating_ips?data_center=" +
            e +
            "&business=" +
            this.state.serviceSystem +
            "&os_type=" +
            0
        );
 
      var res = await ajax.myPost(
        "resource/create_floating_ips?data_center=" +
          this.state.applyFloatIPDataCenter +
          "&business=" +
          this.state.applyFloatIPServiceSystem +
          "&os_type=" +
          this.state.applyFloatIPColony +
          "&amount=" +
          Number(this.state.applyFloatIPNum)
      );
  }

  

原文地址:https://www.cnblogs.com/zhanglanzuopin/p/12922085.html