#跟着坚果学鸿蒙# 鸿蒙next 第三方库axio使用教程来了
·
前言导读
在HarmonyOS NEXT开发中,我们都会遇到有做网络请求的情况,我们可以使用原生的http 也可以使用rcp。但是那些写法都
太原始了。对新手也不是很友好需要自己做大量封装工作,那么有没有好用的三方库呢,是有的axios 我们今天就分享一下axios的
一些使用方法
使用@ohos/axios进行网络请求的完整流程如下:
一、环境配置
- 安装三方库
bashCopy Code
ohpm install @ohos/axios
- 配置网络权限
在module.json5中添加:
jsonCopy Code"requestPermissions": [
{
"name": "ohos.permission.INTERNET"
}
]
二、基础封装方法
- 创建实例配置
import axios from '@ohos/axios'
const instance = axios.create({
baseURL: 'https://api.example.com',
timeout: 5000,
headers: {'X-Custom-Header': 'custom-value'}
})
// 请求拦截器
instance.interceptors.request.use(config => {
// 可添加token等通用参数
return config
}, error => {
return Promise.reject(error)
})
// 响应拦截器
instance.interceptors.response.use(response => {
return response.data
}, error => {
return Promise.reject(error)
})
export default instance
已完成
核心封装包含基础URL配置和拦截器处理36。
三、请求方法示例
- GET请求
typescriptCopy Codeasync function fetchData() {
try {
const res = await instance.get('/api/data')
console.log(res.data)
} catch (err) {
console.error('请求失败:', err)
}
}
- POST请求
typescriptCopy Codeasync function submitData(params: object) {
return instance.post('/api/submit', params)
}
四、文件上传方案
针对阿里云OSS等文件上传场景:
typescriptCopy Codeconst uploadFile = (fileUri: string) => {
const formData = new FormData()
formData.append('file', {
uri: fileUri,
type: 'image/jpeg',
name: 'upload.jpg'
})
return instance.put('/upload', formData, {
headers: {'Content-Type': 'multipart/form-data'}
})
}
需注意鸿蒙平台的文件路径处理方式4。
五、最佳实践建议
- 统一错误处理机制
- 接口地址集中管理
- 请求取消功能实现
- 类型声明文件补充
更多推荐
所有评论(0)