HarmonyOS 鸿蒙Next 基于axios库封装网络请求方法

发布于 1周前 作者 itying888 来自 鸿蒙OS

HarmonyOS 鸿蒙Next 基于axios库封装网络请求方法

// 使用前安装axios请求库，如三层架构则安装在common->basic文件夹下

安装

ohpm i @ohos/axios

卸载

ohpm uninstall @ohos/axios

import axios, { InternalAxiosRequestConfig, AxiosError, AxiosResponse, AxiosRequestConfig } from ‘@ohos/axios’ import { auth } from ‘./Auth’ import { promptAction } from ‘@kit.ArkUI’

// 增加类型 export interface APIErrorType { message: string msg: string code: string }

export const baseURL: string = ‘https://www.my.com/’

// 实例化 通用配置 const instance = axios.create({ // 基地址 baseURL, // 超时事件最长多久不响应，就认为是失败 timeout: 5000 })

// 拦截器配置 // 请求拦截器 // token配置等 instance.interceptors.request.use((config: InternalAxiosRequestConfig) => { const user = auth.getUser() if (user.token) { config.headers[‘Authorization’] = Bearer ${user.token} } return config }, (error: AxiosError) => { return Promise.reject(error) })

// 添加响应拦截器 // 错误统一处理等 instance.interceptors.response.use((response: AxiosResponse) => { return response }, (error: AxiosError<APIErrorType>) => { // 400 打印错误信息 if (error.response?.status == 400) { // 打印错误信息 promptAction.showToast({ message: error.response.data.message }) } else if (error.response?.status == 401) { promptAction.showToast({ message: ‘登录过期’ }) // 删除 用户信息 去登录页 auth.removeUser() // 添加页面跳转 } return Promise.reject(error) })

// 抽取返回值公共部分 export interface HttpResponse<T> { code: string msg: string result: T }

// 简化后续编码 export type ResponseType<T> = AxiosResponse<HttpResponse<T>>

export class RequestAxios { static get<T>(url: string, config?: AxiosRequestConfig): Promise<ResponseType<T>> { return instance.get<null, ResponseType<T>>(url, config) }

static post<T>(url: string, data?: object): Promise<ResponseType<T>> { return instance.post<null, ResponseType<T>>(url, data) }

static delete<T>(url: string, data?: AxiosRequestConfig): Promise<ResponseType<T>> { return instance.delete<null, ResponseType<T>>(url, data) }

static put<T>(url: string, data?: object): Promise<ResponseType<T>> { return instance.put<null, ResponseType<T>>(url, data) } }


更多关于HarmonyOS 鸿蒙Next 基于axios库封装网络请求方法的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html

Harmonyos Next教程
1 回复

更多关于HarmonyOS 鸿蒙Next 基于axios库封装网络请求方法的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS鸿蒙Next系统中，若需基于axios库封装网络请求方法，你应首先确保axios库已正确集成到你的鸿蒙应用项目中。由于axios是一个广泛使用的JavaScript库，主要用于在浏览器和node.js环境中发送HTTP请求，因此在鸿蒙环境下使用时，可能需要注意其运行环境兼容性。

封装网络请求方法通常涉及创建一个服务或工具类，该类中包含发送GET、POST等HTTP请求的方法。这些方法内部将调用axios的相关函数，并处理请求和响应。在封装时，你可考虑添加错误处理、请求超时设置、请求头管理等功能，以增强网络请求的健壮性和灵活性。

例如，你可以创建一个名为networkService.js的文件，并在其中定义如下方法：

import axios from 'axios';

export function get(url, params) {
    return axios.get(url, { params });
}

export function post(url, data) {
    return axios.post(url, data);
}

// 其他HTTP方法...

然后，在你的鸿蒙应用代码中导入并使用这些封装好的方法。

请注意，以上代码示例为简化版，实际项目中可能需根据具体需求进行调整。如果问题依旧没法解决请联系官网客服，官网地址是：https://www.itying.com/category-93-b0.html

回到顶部