0
  • 聊天消息
  • 系统消息
  • 评论与回复
登录后你可以
  • 下载海量资料
  • 学习在线课程
  • 观看技术视频
  • 写文章/发帖/加入社区
创作中心

完善资料让更多小伙伴认识你,还能领取20积分哦,立即完善>

3天内不再提示

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

jf_46214456 来源:jf_46214456 作者:jf_46214456 2024-03-26 21:14 次阅读

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

API接口调用方法

LoginAPI.ets

或+mau123789学习,是v喔

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)
})

审核编辑 黄宇

声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉
  • 鸿蒙OS
    +关注

    关注

    0

    文章

    129

    浏览量

    4279
收藏 人收藏

    评论

    相关推荐

    鸿蒙OS开发实例:【HarmonyHttpClient】网络框架

    鸿蒙上使用的Http网络框架,里面包含纯Java实现的HttpNet,类似okhttp使用,支持同步和异步两种请求方式;还有
    的头像 发表于 04-12 16:58 299次阅读
    <b class='flag-5'>鸿蒙</b><b class='flag-5'>OS</b>开发实例:【HarmonyHttpClient】<b class='flag-5'>网络</b>框架

    鸿蒙OS开发实战:【网络管理HTTP数据请求

    应用通过HTTP发起一个数据请求,支持常见的GET、POST、OPTIONS、HEAD、PUT、DELETE、TRACE、CONNECT方法。
    的头像 发表于 04-01 16:31 190次阅读
    <b class='flag-5'>鸿蒙</b><b class='flag-5'>OS</b>开发实战:【<b class='flag-5'>网络</b>管理HTTP数据<b class='flag-5'>请求</b>】

    鸿蒙OS开发实例:【窥探网络请求

    HarmonyOS 平台中使用网络请求,需要引入 "@ohos.net.http", 并且需要在 module.json5 文件中申请网络权限, 即 “ohos.permission.INTERNET” 本篇文章将尝试使用
    的头像 发表于 04-01 16:11 173次阅读
    <b class='flag-5'>鸿蒙</b><b class='flag-5'>OS</b>开发实例:【窥探<b class='flag-5'>网络</b><b class='flag-5'>请求</b>】

    鸿蒙原生应用开发-网络管理HTTP数据请求

    request请求先返回。可以根据业务需要订阅此消息。 4.调用该对象的request()方法,传入http请求的url地址和可选参数,发起网络请求。 5.按照实际业务需要,解析返回结
    发表于 03-29 17:51

    鸿蒙开发实战:网络请求库【axios

    [Axios] ,是一个基于 promise 的网络请求库,可以运行 node.js 和浏览器中。本库基于[Axios]原库v1.3.4版本进行适配,使其可以运行在 OpenHarmo
    的头像 发表于 03-25 16:47 817次阅读
    <b class='flag-5'>鸿蒙</b>开发实战:<b class='flag-5'>网络</b><b class='flag-5'>请求</b>库【<b class='flag-5'>axios</b>】

    2024款鸿蒙OS 最新HarmonyOS Next_HarmonyOS4.0系列教程分享

    了有关华为鸿蒙的课程,包括清华大学、武汉大学、哈尔滨工业大学等等。据香港《南华早报》报道,当地时间1月3日,加拿大市场研究与咨询机构TechInsights发布按照操作系统(OS)划分的全球智能手机销售
    发表于 02-28 10:29

    鸿蒙OS之UI架构解析

    发送get请求,然后更新articles数组。 aboutToAppear() { // 请求网络数据 axios.get(url).then(response => { //
    发表于 02-20 15:36

    鸿蒙OS和开源鸿蒙什么关系?

    内核,其他功能都以模块的形式存在。     华为用的是鸿蒙OS 我们都知道,华为手机的鸿蒙OS是可以运行安卓软件的,是因为系统中有安卓兼容层,所以可以简单这么理解:
    的头像 发表于 01-30 15:44 376次阅读
    <b class='flag-5'>鸿蒙</b><b class='flag-5'>OS</b>和开源<b class='flag-5'>鸿蒙</b>什么关系?

    鸿蒙Harmony是如何影响Android工程师的呢?

    其实鸿蒙在2019就已经出来了,那时候还是套壳Android的。从2023年9月的发布会上,华为宣布鸿蒙原生应用全面启动、HarmonyOS NEXT亮相以后,围绕着纯血鸿蒙展开的
    发表于 01-14 22:14

    鸿蒙 OS 应用开发初体验

    的操作系统平台和开发框架。HarmonyOS 的目标是实现跨设备的无缝协同和高性能。 DevEco Studio 对标 Android Studio,开发鸿蒙 OS 应用的 IDE。 启动页面
    发表于 11-02 19:38

    Orange Pi OS(OH)发布,开源鸿蒙PC端来了!

    正式向大家宣布一个喜讯:基于OpenHarmony定制研发的Orange Pi OS(OH)即将发布!日前,迅龙开源鸿蒙的工程师团队已经在搭载RK3566的开发板Orange Pi 3B上完成
    发表于 10-26 11:32

    如何使用Proxyman抓取Android的https请求

    有时,您可能需要测试您的移动应用程序并检查与其关联的所有网络请求。在网络上,此任务非常简单,只需按Ctrl + Shift + I打开开发人员工具即可。
    的头像 发表于 10-19 10:29 605次阅读
    如何使用Proxyman抓取<b class='flag-5'>Android</b>的https<b class='flag-5'>请求</b>?

    基于OkHttp 3.10.0的源码案例解析

    本文尝试从源代码出发探究 OkHttp 的基本原理,并列举了一个简单的例子说明拦截器在我们项目中的实际应用。本文源代码基于 OkHttp 3.10.0。
    发表于 10-17 15:29 98次阅读
    基于<b class='flag-5'>OkHttp</b> 3.10.0的源码案例解析

    幂等和非幂等请求的一些定义和分析

    最近在做项目的过程中,有一个需求是在客户端 HTTP 请求失败后,增加一个重试机制,然后我就翻了一些有关“重试”的库,找到一个 axios-retry,在了解的过程中,我就发现了里面有一个默认的配置
    的头像 发表于 10-17 10:50 320次阅读

    深入浅出OkHttp源码解析及应用实践

    OkHttp 在 Java 和 Android 世界中被广泛使用,深入学习源代码有助于掌握软件特性和提高编程水平。
    的头像 发表于 06-08 15:47 350次阅读
    深入浅出<b class='flag-5'>OkHttp</b>源码解析及应用实践