HarmonyOS鸿蒙Next中httpRequest封装(预览器看效果)

HarmonyOS鸿蒙Next中httpRequest封装(预览器看效果)

// MyRequest.ets

import { http } from "@kit.NetworkKit";
const BASE_URL = 'http://v1.yiketianqi.com'
export function MyRequest<T,K>(
  url:string,
  method:http.RequestMethod,
  requestData: K
) {
  // 创建http对象
  const httpRequest = http.createHttp()
  return new Promise<(value:T) => void,reject:(value?:string) => void>(
    (resolve,reject) => {
      // 发送异步代码
      httpRequest.request(BASE_URL + url,{
        method:method,
        header:{
          'Content-type': 'application/json'
        },
        extraData:JSON.stringify(requestData) || '',
        connectTimeout: 9000,
        readTimeout: 9000
      },(error:Error,data:http.HttpResponse) => {
        // 成功
        if(!error) {
          resolve(JSON.parse(data.result as string))
          console.log(url+'接口请求成功')
          httpRequest.destroy()
        } else {
          reject(JSON.stringify(error))
          console.log(url+'接口请求失败')
          // 取消订阅http响应头事件
          httpRequest.off('headerReceive')
          httpRequest.destroy()
        }
      })
    }
  )
}

// 调用

Button('发送请求')
  .onClick(async() => {
    const res = await MyRequest<Array<CartModel>,string>(
      '/free/month?unescape=1&appid=92829937&appsecret=4jOJbcDM',
      http.RequestMethod.GET,
      ''
    )
    console.log(res['city'] + '当前城市')
  })

更多关于HarmonyOS鸿蒙Next中httpRequest封装(预览器看效果)的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于HarmonyOS鸿蒙Next中httpRequest封装(预览器看效果)的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS鸿蒙Next中，httpRequest封装可以通过@ohos.net.http模块实现。首先，导入http模块，然后创建HttpRequest对象，设置请求参数（如URL、方法、头信息等），最后发送请求并处理响应。预览器效果可通过console.log输出或UI组件展示。示例代码如下：

import http from '@ohos.net.http';

let httpRequest = http.createHttp();
let url = 'https://example.com/api';
let options = {
  method: 'GET',
  header: { 'Content-Type': 'application/json' }
};

httpRequest.request(url, options, (err, data) => {
  if (err) {
    console.error('Request failed:', err);
  } else {
    console.log('Response:', data.result);
  }
});

通过这种方式，可以在鸿蒙Next中高效地封装和使用httpRequest。

回到顶部