HarmonyOS通过 axios发送HTTP请求

我之前的文章 HarmonyOS 发送http网络请求那么今天我们就来说说axios
这个第三方工具想必所有的前端开发者都不会陌生

axios 本身也属于 HTTP请求所以鸿蒙开发中也支持它
但首先想在HarmonyOS中使用第三方工具库就要先下载安装 ohpm 具体可以参考我的文章 HarmonyOS 下载安装ohpm 鸿蒙第三方包管理工具

首先呢我们还是要在对应模块下的 module.json5 文件中的 module下加上

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

申请网络权限这样 HTTP请求才能发出去
在这里插入图片描述
然后我们访问地址 https://ohpm.openharmony.cn/#/cn/home
OK 这个网站中就是 OpenHmarmony 三方库的一个中心仓了

这里基本可以找到所有 harmonyos的第三方库
最受欢迎中就可以看到 axios

这里呢我们就可以点进去看一下
在这里插入图片描述
进入详情页后就能看到它的介绍后下载命令

我们还是先打开编辑器打开项目

我们项目根目录中会有一个 oh-package.json5

我们常规web端项目也都会有一个 package.json
是有一些共同点的我们项目所有的依赖都会在这个文件的 dependencies 下的

这里呢我们打开项目的 Terminal 简单说运行终端起来
在这里插入图片描述
然后我们将官方给我们的安装命令搬过来
终端执行

ohpm install @ohos/axios

在这里插入图片描述
安装成功后 oh-package.json5 中的 dependencies 就能显示出工具的信息和版本啦

项目根目录下的 oh_modules 中就装了我们项目所有的依赖库

那么我们axios已经进来就可以使用它了

我这边起了一个 java的项目
在这里插入图片描述
为本机提供了一个数据接口

这边大家也要想办法自己弄个数据接口

然后我们在需要请求的组件中这样写

import axios from "@ohos/axios";
@Entry
@Component
struct Dom {

  aboutToAppear() {
    axios.get(
    "http://localhost/books",
    ).then(res =>{
        let data:string = JSON.stringify(res);
        console.log(data);
    }).catch(err=> {
      console.log("请求失败");
    })
  }

  build() {
    Column({space: 30}) {

    }
    .width('100%')
    .height('100%')
  }
}