鸿蒙OS封装【axios 网络请求】（类似Android的Okhttp3）

news2025/4/6 16:26:52

Okhttp.ets

/**
 * 网络请求
 */
import axios from '@ohos/axios'
import httpConstants from '../net/HttpConstants'
import errorCode from '../utils/errorCode'
import toast from '../utils/ToastUtils'
import router from '../utils/RouterUtils'
import SPUtils from '../utils/SPUtils'
import SpConstants from '../net/SpConstants'

axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
// 创建axios实例
const service = axios.create({
  baseURL:httpConstants.url,
  timeout:10000
})
// request拦截器
service.interceptors.request.use(async config => {
  // 是否需要设置 token
  const access_token = await SPUtils.get(SpConstants.accessToken,"")
  if (access_token != "") {
    config.headers['Authorization'] = 'Bearer ' + access_token // 让每个请求携带自定义token 请根据实际情况自行修改
  }
  return config
}, error => {
  console.log(error)
  Promise.reject(error)
})

// 响应拦截器
service.interceptors.response.use(res => {
  // 未设置状态码则默认成功状态
  const code = res.data.code || 200;
  // 获取错误信息
  const msg = errorCode[code] || res.data.msg || errorCode['default']
  if (code === 401) {
    toast.show("登录状态已过期，您可以继续留在该页面，或者重新登录")
    router.goNot('pages/Login')
  } else if (code === 500) {
    toast.show(msg)
    return Promise.reject(new Error(msg))
  } else if (code !== 200) {
    toast.show(msg)
    return Promise.reject('error')
  } else {
    return res
  }
},
  error => {
    console.log('err' + error)
    let { message } = error;
    if (message == "Network Error") {
      message = "后端接口连接异常";
    }
    else if (message.includes("timeout")) {
      message = "系统接口请求超时";
    }
    else if (message.includes("Request failed with status code")) {
      message = "系统接口" + message.substr(message.length - 3) + "异常";
    }
    toast.show(message)
    return Promise.reject(error)
  }
)

export default service

鸿蒙应用开发知识更新在gitee.com/li-shizhen-skin/harmony-os/blob/master/README.md可前往学习更多。

搜狗高速浏览器截图20240326151344.png

API接口调用方法

LoginAPI.ets

import okHttp from '../utils/Okhttp'

// 登录方法-POST方法
export function login(username, password, code, uuid) {
  const data = {
    username,
    password,
    code,
    uuid
  }
  return okHttp({
    url: '/login',
    method: 'post',
    data: data
  })
}

// 获取用户详细信息-GET方法
export function getInfo() {
  return okHttp({
    url: '/getInfo',
    method: 'get'
  })
}

Login.ets页面

import {login,getInfo} from '../api/LoginAPI'
login(this.userName,this.userPwd,this.userCode,this.uuid).then(res=>{
  SPUtils.put(SpConstants.appUser,this.userName)
  SPUtils.put(SpConstants.appPwd,this.userPwd)
  SPUtils.put(SpConstants.accessToken,res.data.token)
})

最后呢，很多开发朋友不知道需要学习那些鸿蒙技术？鸿蒙开发岗位需要掌握那些核心技术点？为此鸿蒙的开发学习必须要系统性的进行。

而网上有关鸿蒙的开发资料非常的少，假如你想学好鸿蒙的应用开发与系统底层开发。你可以参考这份资料，少走很多弯路，节省没必要的麻烦。由两位前阿里高级研发工程师联合打造的《鸿蒙NEXT星河版OpenHarmony开发文档》里面内容包含了（ArkTS、ArkUI开发组件、Stage模型、多端部署、分布式应用开发、音频、视频、WebGL、OpenHarmony多媒体技术、Napi组件、OpenHarmony内核、Harmony南向开发、鸿蒙项目实战等等）鸿蒙（Harmony NEXT）技术知识点

如果你是一名Android、Java、前端等等开发人员，想要转入鸿蒙方向发展。可以直接领取这份资料辅助你的学习。下面是鸿蒙开发的学习路线图。