鸿蒙next网络请求封装

我这里使用的是鸿蒙官网的http做网络请求，没有用axios三方库去做网络请求，基本格式类似，只是多一个加载三方库以及符合axios写法的不同而已 整个网络请求需要的文件

• api.ets //网络请求核心方法
• config.ts //管理公共请求地址及一些相关数据，例如clientKey等
• type.ets //公共的数据类型文件
• localStorage.ets //部分请求需要使用到鉴权，这个可以用来取用户首选项或者键值对存储中的数据 具体参考这个用户首选项和键值对数据封装

step1,给项目添加网络权限，

项目名称/entry/src/main/module.json5

"requestPermissions":[

{
  "name": "ohos.permission.INTERNET"
}
]

step2,网络请求核心方法封装

这里的color-token 是你项目中对应的通过header头传的token键名

import { http } from '@kit.NetworkKit';
import { localStorage } from './GlobalContext';
import { ObjectType } from './type';

class ResponseResult {
  /**
   * Code returned by the network request: success, fail.
   */
  code: number;
  /**
   * Message returned by the network request.
   */
  message: string ;
  /**
   * Data returned by the network request.
   */
  content: string | Object | ArrayBuffer;
  contentEncrypt: string
  token_type?: string;
  expires_in?: number;
  access_token?: string;
  refresh_token?: string;
  specialInfo?: string;

  constructor() {
    this.code = -1;
    this.message = '';
    this.content = '';
    this.contentEncrypt = ''
  }
}

//网络请求公共库调用
async function httpRequestGet(url: string, needToken?: boolean): Promise<ResponseResult> {
  let httpCreated = http.createHttp();
  let colorToken: string  ='';
  const token=await localStorage.getItem('token')
  if (needToken && token && typeof token =='string') {
    colorToken = token
  }
  // console.log(colorToken,'colorToken')
  let responseResult = httpCreated.request(url, {
    method: http.RequestMethod.GET,
    readTimeout: 50000,
    header: {
      'contentType':'application/form-data',
      'color-token':colorToken
    },
    connectTimeout: 50000,
    extraData: {}
  })
  let serverData: ResponseResult = new ResponseResult();
  return responseResult.then((value: http.HttpResponse) => {
     console.log( '=>response result',JSON.parse(String(value.result)).code, value.responseCode,url,);
    if (value.responseCode == 200) {
      let result = `${value.result}`
      let resultJSON: ResponseResult = JSON.parse(result);
      if (resultJSON.code == 0) {
        serverData.content = resultJSON.content;
      }
      serverData.code = resultJSON.code;
      serverData.message = resultJSON.message;
      serverData.contentEncrypt = resultJSON.contentEncrypt
    } else {
      serverData.message = `网络请求失败，&${value.responseCode}`;
    }
    return serverData
  }).catch((err: ResponseResult) => {
    console.info('responseResult===>error',colorToken,url, JSON.stringify(err))
    serverData.message = '网络请求失败';
    return serverData;
  })
}

async function httpRequestPost(url: string, extraData: ObjectType,needToken?:boolean): Promise<ResponseResult> {
  let colorToken: string  ='';
  const token=await localStorage.getItem('token')
  if (needToken && token && typeof token =='string') {
    colorToken = token
  }
   let httpCreated = http.createHttp();
  let responseResult = httpCreated.request(url, {
    method: http.RequestMethod.POST,
    readTimeout: 50000,
    header: {
      'contentType':'application/form-data',
      'color-token':colorToken
    },//new Header('application/x-www-form-urlencoded',colorToken),
    connectTimeout: 50000,
    extraData: extraData,
    expectDataType: http.HttpDataType.STRING,
  })

  let serverData: ResponseResult = new ResponseResult();
  return responseResult.then((value: http.HttpResponse) => {
    console.log( '=>response result',JSON.parse(String(value.result)).code,colorToken, value.responseCode,url,JSON.stringify(extraData));
    if (value.responseCode == 200) {
      let result = `${value.result}`
      let resultJSON: ResponseResult = JSON.parse(result);
      if (resultJSON.code == 0) {
        serverData.content = resultJSON.content;
      }
      if (resultJSON.token_type) {
        serverData.specialInfo = JSON.stringify(resultJSON)
      }

      serverData.code = resultJSON.code;
      serverData.message = resultJSON.message;
      serverData.contentEncrypt = resultJSON.contentEncrypt
    } else {
      serverData.message = `网络请求失败，&${value.responseCode}`;
      if (value.result) {
        let result = `${value.result}`
        let resultJSON: ResponseResult = JSON.parse(result);
        if (resultJSON.message) {
          serverData.message = resultJSON.message
        }
      }
    }
    return serverData
  }).catch((err:ResponseResult) => {
    console.info('responseResult===>error',JSON.stringify(extraData),url, JSON.stringify(err))
    serverData.message = '网络请求失败';
    return serverData;
  })


}

export { ResponseResult, httpRequestGet, httpRequestPost }

step3:config.ts

let url_XXX ='https:aaa.com'
let client_id = '2'

let bundleFlags = bundleManager.BundleFlag.GET_BUNDLE_INFO_WITH_APPLICATION | bundleManager.BundleFlag.GET_BUNDLE_INFO_WITH_METADATA;
let info = bundleManager.getBundleInfoForSelfSync(bundleFlags).appInfo?.appProvisionType
//info==release 表示正式环境
if(info=='release'){
    url_XXX ='https:bbb.com'
    let client_id = '3'
}
export {url_xxx,client_id}

steps4:type.ets

//这里主要是将所有可能的传参都做了定义
interface ObjectType {
  signature?: string,
  mobile?: string,
  }
  export {ObjectType}

step5:进一步封装每个具体的网络请求

//查询用户是否注册
function checkRegister(mobile: string): Promise<checkRegisterType> {
  return new Promise(async (resolve: Function) => {
    let bundleInfo = await returnBundleInfo();
    let getParams: string = `mobile=${
    mobile
    }&version=${
    bundleInfo.versionName
    }&nonce_str=${
    generateRandomString()
    }&native_type=3`
    let signature = signInfo(getParams)
    let url = `${czy_service}/xxxx?${getParams}`
    httpRequestGet(url).then((data: ResponseResult) => {
      // console.log(JSON.stringify(data),'------', url)
      if (data.code == 0) {
        resolve(data.content)
      } else {
        ShowT.shortToast(data.message)
        resolve({ is_register: -1 })
      }
    }).catch(() => {
      ShowT.shortToast('请求失败')
      resolve({ is_register: -1 })
    })
  })
}
export {checkRegister}