支持GET和POST请求,支持头部拦截token

前言

从url到okgo,从MVC到MVI,一路的更迭,未曾想今日竟从Android跳到了HarmonyOS。行路难,归去来

一、版本

DevecoStudio5.0.3，API 12

二、使用步骤

1.引入库

代码如下（示例）：

import { BaseResp } from '../entity/BaseResp';
import { http } from '@kit.NetworkKit';
import DPUtil from './DPUtil';
import LogUtil from './LogUtil';

2.添加权限

代码如下（示例）：在mo'dule.json5文件添加

{
  "module": {
    "requestPermissions": [
      {
        "name": "ohos.permission.INTERNET"
      },
    ],
    "name": "entry",
    "type": "entry",
    "description": "$string:module_desc",
    "mainElement": "EntryAbility",
    "deviceTypes": [
      "phone",
      "tablet",
      "2in1"
    ],

3.Get请求

代码如下（示例）：

export function httpRequestGet(url: string, params?: string): Promise<BaseResp> {
  //创建Http的请求对象
  let httpRequest = http.createHttp()
  //拼接url
  let reqUrl = params ? `${url}?${params}` : url
  //发起请求
  let responseResult = httpRequest.request(reqUrl, {
    method: http.RequestMethod.GET,
    header: {
      'Content-Type': 'application/jason;charset = utf-8'
    },
    connectTimeout: 10000,
    readTimeout: 10000,
  })
  let responseData = new BaseResp()
  //解析返回数据
  return responseResult.then((httpResponse: http.HttpResponse) => {
    LogUtil.info(httpResponse.result.toString())
    let resultData: BaseResp = JSON.parse(httpResponse.result.toString())
    if (httpResponse.responseCode == 200) {
      responseData.code = resultData.code
      responseData.message = resultData.message
      responseData.data = resultData.data
    } else {
      responseData.message = `接口请求失败:${httpResponse.responseCode}`
    }
    return responseData
  }).catch(() => {
    responseData.message = 'Http请求异常'
    return responseData
  })
}

这里是不包含token的get请求,其中BaseResp是自己创建的实体类，具体的思路在注释上已经标明

export async function httpRequestGetWithToken(url: string, params?: string): Promise<BaseResp> {
  //获取token
  let tokenValue = DPUtil.getValue('token')
  //创建Http的请求对象
  let httpRequest = http.createHttp()
  //拼接url
  let reqUrl = params ? `${url}?${params}` : url
  //发起请求
  let responseResult = httpRequest.request(reqUrl, {
    method: http.RequestMethod.GET,
    header: {
      'Content-Type': 'application/jason;charset = utf-8',
      'token': tokenValue
    },
    connectTimeout: 10000,
    readTimeout: 10000,
  })
  let responseData = new BaseResp()
  //解析返回数据
  return responseResult.then((httpResponse: http.HttpResponse) => {
    LogUtil.info(httpResponse.result.toString())
    let resultData: BaseResp = JSON.parse(httpResponse.result.toString())
    if (httpResponse.responseCode == 200) {
      responseData.code = resultData.code
      responseData.message = resultData.message
      responseData.data = resultData.data
    } else {
      responseData.message = `接口请求失败:${httpResponse.responseCode}`
    }
    return responseData
  }).catch(() => {
    responseData.message = 'Http请求异常'
    return responseData
  })
}

这是是添加了token的Get请求,整体思路没有改动

4.POST请求 

export function httpRequestPOST(url: string, params?: object): Promise<BaseResp> {
  //创建Http的请求对象
  let httpRequest = http.createHttp()
  //发起请求
  let responseResult = httpRequest.request(url, {
    method: http.RequestMethod.POST,
    header: {
      'Content-Type': 'application/jason;charset = utf-8'
    },
    extraData: params ? params : '',
    connectTimeout: 10000,
    readTimeout: 10000,
  })
  let responseData = new BaseResp()
  //解析返回数据
  return responseResult.then((httpResponse: http.HttpResponse) => {
    LogUtil.info(httpResponse.result.toString())

    let resultData: BaseResp = JSON.parse(httpResponse.result.toString())
    if (httpResponse.responseCode == 200) {
      responseData.code = resultData.code
      responseData.message = resultData.message
      responseData.data = resultData.data
    } else {
      responseData.message = `接口请求失败:${httpResponse.responseCode}`
    }
    return responseData
  }).catch(() => {
    responseData.message = 'Http请求异常'
    return responseData
  })
}

post和get的唯一差别就是extraData

这一段是post带token

export async function httpRequestPOSTWithToken(url: string, params?: object): Promise<BaseResp> {
  //获取token
  let tokenValue = DPUtil.getValue('token')
  //创建Http的请求对象
  let httpRequest = http.createHttp()

  //发起请求
  let responseResult = httpRequest.request(url, {
    method: http.RequestMethod.POST,
    header: {
      'Content-Type': 'application/jason;charset = utf-8',
      'token': tokenValue
    },
    extraData: params ? params : '',
    connectTimeout: 10000,
    readTimeout: 10000,
  })
  let responseData = new BaseResp()
  //解析返回数据
  return responseResult.then((httpResponse: http.HttpResponse) => {
    LogUtil.info(httpResponse.result.toString())
    let resultData: BaseResp = JSON.parse(httpResponse.result.toString())
    if (httpResponse.responseCode == 200) {
      responseData.code = resultData.code
      responseData.message = resultData.message
      responseData.data = resultData.data
    } else {
      responseData.message = `接口请求失败:${httpResponse.responseCode}`
    }
    return responseData
  }).catch(() => {
    responseData.message = 'Http请求异常'
    return responseData
  })
}

总结

通过对网络请求进行封装可以加深对底层的理解,后续可以直接使用官方的网络请求框架