HarmonyOS网络请求的简单用法,HttpUtil简单封装

请求网络获取数据

  • 点击按钮发送一个post请求,发送一条string
  • 由于此处的返回result.data本身就是一个string,因此不需要转换类型
ts 复制代码
      Button('请求网络')
        .margin({ top: 10 })
        .fontSize(24)
        .fontWeight(FontWeight.Bold)
        .onClick(() => {

          httpRequestPost('http://test.xxx', "你好")
            .then((result: ResponseResult) => {
              console.log("msg=" + result.msg)
              console.log("data=" + result.data)
              this.message = result.data.toString()
            })

        })
  • 如果需要类型转换,可以使用as转换
  • result.data as ResponseToken
ts 复制代码
          httpRequestGet('http://test.xxx')
            .then((result: ResponseResult) => {
              let data = result.data as ResponseToken
              console.log("msg=" + result.msg)
              console.log("token=" + data.access_token)
            })
ts 复制代码
export class ResponseToken {
  access_token: string = "";
  expires_in: string = "";
  expires_date: string = "";
}

封装一个HttpUtil

  • 对外开放一个httpRequestGet和httpRequestPost,用于get和post请求
ts 复制代码
import { http } from '@kit.NetworkKit';
import ResponseResult from './ResponseResult';

/**
 * Initiate an HTTP GET request to the specified URL.
 */
export function httpRequestGet(url: string) {
  return httpRequest(url, http.RequestMethod.GET);
}

/**
 * Initiate an HTTP POST request to the specified URL.
 */
export function httpRequestPost(url: string, newsData: string) {
  return httpRequest(url, http.RequestMethod.POST, newsData);
}

/**
 * Initiates an HTTP request to a given URL.
 *
 * @param url URL for initiating an HTTP request
 * @param method Request method.
 * @param extraData Additional data of the request.
 * @returns Returns {@link ResponseResult}.
 */
function httpRequest(url: string, method: http.RequestMethod, params?: string): Promise<ResponseResult> {
  let httpRequest = http.createHttp();
  let responseResult = httpRequest.request(url, {
    method: method,
    header: {
      'Content-Type': 'application/json'
    },
    extraData: params
  });
  let serverData = new ResponseResult();
  // Processes the data and returns.
  return responseResult.then((value: http.HttpResponse) => {
    if (value.responseCode === 200) {
      // Obtains the returned data.
      let result = `${value.result}`;
      let resultJson: ResponseResult = JSON.parse(result);
      if (resultJson.code === '000000') {
        serverData.data = resultJson.data;
      }
      serverData.code = resultJson.code;
      serverData.msg = resultJson.msg;
    } else {
      serverData.msg = `Network request failed, please try later!&${value.responseCode}`;
    }
    return serverData;
  }).catch(() => {
    serverData.msg = 'Network request failed, please try later!';
    return serverData;
  });
}
  • ResponseResult为服务端返回的基本结构
ts 复制代码
export default class ResponseResult {
  /**
   * Code returned by the network request: success, fail.
   */
  code: string;

  /**
   * Message returned by the network request.
   */
  msg: string | Resource;

  /**
   * Data returned by the network request.
   */
  data: string | Object | ArrayBuffer;

  constructor() {
    this.code = '';
    this.msg = '';
    this.data = '';
  }

}
相关推荐
xmdy586618 小时前
Flutter+开源鸿蒙实战|校园易生活Day1 项目初始化搭建+开发环境校验+工程目录规范+第三方库集成+多端屏幕适配+全局底部导航
flutter·开源·harmonyos
想你依然心痛19 小时前
HarmonyOS 6(API 23)实战:打造“空间交互式AR健身私教“——基于Face AR疲劳监测 + Body AR姿态识别的沉浸光感运动系统
ar·restful·harmonyos·悬浮导航·沉浸光感
xmdy586619 小时前
Flutter+开源鸿蒙实战|校园易生活Day2 第三方库批量集成+全局Toast提示+网络状态监听+首页轮播图+资讯卡片布局
flutter·开源·harmonyos
前端不太难20 小时前
为什么说鸿蒙 App 是“状态系统”?
华为·状态模式·harmonyos
●VON20 小时前
猫咪专注 CatFocus 技术博客:一款鸿蒙原生自律计时工具的设计与实现
学习·华为·harmonyos·von·猫咪专注
小雨青年20 小时前
HarmonyOS 原生应用《会议随记 Pro》 V1.3 更新 支持折叠屏、2in1 和 Pura X Max 三形态适配
华为·harmonyos
xmdy58661 天前
Flutter+开源鸿蒙实战|智联邻里Day9 系统权限适配+应用全局分享+缓存深度优化+版本更新弹窗
flutter·开源·harmonyos
李李李勃谦1 天前
鸿蒙PC日志分析工具:实时监控、高亮显示与智能过滤
华为·harmonyos
maaath1 天前
【maaath】Flutter for OpenHarmony 乐器学习应用开发实战
flutter·华为·harmonyos
李游Leo2 天前
HarmonyOS AbilityStage 实战:别把启动参数散落在每个页面里
harmonyos