以下是个人封装的代码作为一个基本示例,也可以去参考官方文档自行配置

@ohos.net.http (数据请求)-ArkTS API-Network Kit(网络服务)-网络-系统 - 华为HarmonyOS开发者https://developer.huawei.com/consumer/cn/doc/harmonyos-references/js-apis-http#httpcreatehttp

import { http } from '@kit.NetworkKit';
import { BusinessError } from '@kit.BasicServicesKit';
import { JSON } from '@kit.ArkTS';

/**
 * 封装请求的代码
 *
 */
export function myHttpUtil(url: string, method: http.RequestMethod, requestData: string) {
  // 每一个httpRequest对应一个HTTP请求任务,不可复用。
  const httpRequest = http.createHttp();
  return new Promise((resolve:(value:string)=>void,reject:(value?:string)=>void)=>{
    //request发送请求是异步的
    // 用于订阅HTTP响应头,此接口会比request请求先返回(可以根据业务需要订阅此消息)
    httpRequest.on('headersReceive', (header) => {
      console.info('http响应头 ' + JSON.stringify(header));
    });
    httpRequest.request(url, {
      // 可选,默认为http.RequestMethod.GET,用于从服务器获取数据,而POST方法用于向服务器上传数据。
      method: method,
      // 开发者根据自身业务需要添加header字段。
      header: {
        //浏览器告诉后端,前端传递的数据格式
        'Content-Type': 'application/json'
      },
      //设置请求要传递给后端的数据
      extraData: requestData,
      // 可选,默认为60000ms。
      connectTimeout: 60000,
      readTimeout: 60000
    }, (err: BusinessError, data: http.HttpResponse) => {
      if (!err) {
        // data.result为HTTP响应内容,可根据业务需要进行解析。
        console.info('成功的结果:' + JSON.stringify(data.result));
        resolve(JSON.stringify(data))
        console.info('code:' + JSON.stringify(data.responseCode));
        console.info('type:' + JSON.stringify(data.resultType));
        // data.header为HTTP响应头,可根据业务需要进行解析。
        console.info('header:' + JSON.stringify(data.header));
        console.info('cookies:' + JSON.stringify(data.cookies)); // 8+
        // 当该请求使用完毕时,调用destroy方法主动销毁。
        httpRequest.destroy();
      } else {
        console.error('请求失败,原因:' + JSON.stringify(err));
        reject(JSON.stringify(err))
        // 取消订阅HTTP响应头事件。
        httpRequest.off('headersReceive');
        // 当该请求使用完毕时,调用destroy方法主动销毁。
        httpRequest.destroy();
      }
    })
  })

}
  //测试代码运行结果
    Button("发送请求").onClick(async (event:ClickEvent)=>{
      const  res =await myHttpUtil(
        "http://192.168.1.94:4523/m1/5780381-5464712-default/pet/1",
        http.RequestMethod.GET,
        ""
      )

    })

注意:Couldn‘t connect to server的情况

模拟器显示的原因如下

但是直接通过预览器的话是可以正常拿到数据。下面详细解释一下:

  • 当你在自己电脑上,用调试器直接运行程序、访问本机启动的服务器时,因为程序和服务器都在同一台电脑里,电脑自己能识别 localhost 或者 127.0.0.1 ,它们就代表 “本机”,所以直接用这俩地址,就能让程序找到电脑上的服务器
  • 但要是用本地模拟器(比如鸿蒙模拟器),情况就变了:模拟器虽然跑在你电脑上,但它在系统里算 “独立设备” ,和你电脑本机不是同一 “身份”。这时候,模拟器要访问你电脑上的服务器,不能用 localhost/127.0.0.1(因为在模拟器视角里,这俩地址代表 “模拟器自己”,而非你真实的电脑)。

所以,你得换成你电脑的ip地址才行,这样调整后,模拟器就能正常访问你电脑启动的服务啦。通过win+r操作,输入cmd进入终端,ipconfig命令找到自己电脑的ipv4地址即可 

Logo

讨论HarmonyOS开发技术,专注于API与组件、DevEco Studio、测试、元服务和应用上架分发等。

更多推荐