ARTICLE DETAIL

建站实战干货

来自一线的建站与推广经验沉淀,每一条都经过真实交付验证。

鸿蒙 - arkTs:网络请求封装和使用

2026/8/26 11:28:22 拓冰建站 浏览量
鸿蒙 - arkTs:网络请求封装和使用

1. module.json5文件配置网络请求

{"module": {"requestPermissions": [{"name": "ohos.permission.INTERNET"}]}
}

2. 在pages同级创建一个文件夹,起名为api

3. api文件夹下创建index.ts文件,文件内容:

import http from '@ohos.net.http';// 接口参数格式校验
interface ReqObj {url: stringparams?: object | string | number
}export default async function getHttpData(reqObj:ReqObj): Promise<any>{let dataList: any = []let httpRequest = http.createHttp();let response = httpRequest.request("填写HTTP请求的URL地址", {// 接口请求methodmethod: http.RequestMethod.POST,// 接口请求头header: {'Content-Type': 'application/json'},//使用POST请求时此字段用于传递内容extraData: {data: ''},// 可选,指定返回数据的类型expectDataType: http.HttpDataType.STRING,});await response.then((data) => {const code = data.responseCodeif (code == 200) {const response = data.result + "";const res = JSON.parse(response).datadataList = res}else if (code === 401){// 登录状态失效}}).catch((err) => {console.info('error:' + JSON.stringify(err));})return dataList;
}

4. 调用接口:

// 引入定义的接口
import getHttpData from '../api/index'@Entry
@Component
struct Index {async aboutToAppear() {const list = await getHttpData('接口参数')console.log(list)}build() {Column() {}}
}