初识鸿蒙之网络封装

支持GET和POST哀求,支持头部拦截token
    文章目录

  目录
前言
一、版本
二、使用步调
1.引入库
2.添加权限
3.Get哀求
4.POST哀求 
总结

---

前言

从url到okgo,从MVC到MVI,一路的更迭,未曾想本日竟从Android跳到了HarmonyOS。行路难,归去来

一、版本

DevecoStudio5.0.3，API 12
二、使用步调

1.引入库

代码如下（示例）：

1. import { BaseResp } from '../entity/BaseResp';
2. import { http } from '@kit.NetworkKit';
3. import DPUtil from './DPUtil';
4. import LogUtil from './LogUtil';

复制代码

2.添加权限

代码如下（示例）：在mo'dule.json5文件添加

1. {
2.   "module": {
3.     "requestPermissions": [
4.       {
5.         "name": "ohos.permission.INTERNET"
6.       },
7.     ],
8.     "name": "entry",
9.     "type": "entry",
10.     "description": "$string:module_desc",
11.     "mainElement": "EntryAbility",
12.     "deviceTypes": [
13.       "phone",
14.       "tablet",
15.       "2in1"
16.     ],

复制代码

3.Get哀求

代码如下（示例）：

2. export function httpRequestGet(url: string, params?: string): Promise<BaseResp> {
3.   //创建Http的请求对象
4.   let httpRequest = http.createHttp()
5.   //拼接url
6.   let reqUrl = params ? `${url}?${params}` : url
7.   //发起请求
8.   let responseResult = httpRequest.request(reqUrl, {
9.     method: http.RequestMethod.GET,
10.     header: {
11.       'Content-Type': 'application/jason;charset = utf-8'
12.     },
13.     connectTimeout: 10000,
14.     readTimeout: 10000,
15.   })
16.   let responseData = new BaseResp()
17.   //解析返回数据
18.   return responseResult.then((httpResponse: http.HttpResponse) => {
19.     LogUtil.info(httpResponse.result.toString())
20.     let resultData: BaseResp = JSON.parse(httpResponse.result.toString())
21.     if (httpResponse.responseCode == 200) {
22.       responseData.code = resultData.code
23.       responseData.message = resultData.message
24.       responseData.data = resultData.data
25.     } else {
26.       responseData.message = `接口请求失败:${httpResponse.responseCode}`
27.     }
28.     return responseData
29.   }).catch(() => {
30.     responseData.message = 'Http请求异常'
31.     return responseData
32.   })
33. }

复制代码

这里是不包罗token的get哀求,此中BaseResp是自己创建的实体类，具体的思绪在解释上已经标明

1. export async function httpRequestGetWithToken(url: string, params?: string): Promise<BaseResp> {
2.   //获取token
3.   let tokenValue = DPUtil.getValue('token')
4.   //创建Http的请求对象
5.   let httpRequest = http.createHttp()
6.   //拼接url
7.   let reqUrl = params ? `${url}?${params}` : url
8.   //发起请求
9.   let responseResult = httpRequest.request(reqUrl, {
10.     method: http.RequestMethod.GET,
11.     header: {
12.       'Content-Type': 'application/jason;charset = utf-8',
13.       'token': tokenValue
14.     },
15.     connectTimeout: 10000,
16.     readTimeout: 10000,
17.   })
18.   let responseData = new BaseResp()
19.   //解析返回数据
20.   return responseResult.then((httpResponse: http.HttpResponse) => {
21.     LogUtil.info(httpResponse.result.toString())
22.     let resultData: BaseResp = JSON.parse(httpResponse.result.toString())
23.     if (httpResponse.responseCode == 200) {
24.       responseData.code = resultData.code
25.       responseData.message = resultData.message
26.       responseData.data = resultData.data
27.     } else {
28.       responseData.message = `接口请求失败:${httpResponse.responseCode}`
29.     }
30.     return responseData
31.   }).catch(() => {
32.     responseData.message = 'Http请求异常'
33.     return responseData
34.   })
35. }

复制代码

这是是添加了token的Get哀求,团体思绪没有改动
4.POST哀求 

1. export function httpRequestPOST(url: string, params?: object): Promise<BaseResp> {
2.   //创建Http的请求对象
3.   let httpRequest = http.createHttp()
4.   //发起请求
5.   let responseResult = httpRequest.request(url, {
6.     method: http.RequestMethod.POST,
7.     header: {
8.       'Content-Type': 'application/jason;charset = utf-8'
9.     },
10.     extraData: params ? params : '',
11.     connectTimeout: 10000,
12.     readTimeout: 10000,
13.   })
14.   let responseData = new BaseResp()
15.   //解析返回数据
16.   return responseResult.then((httpResponse: http.HttpResponse) => {
17.     LogUtil.info(httpResponse.result.toString())
19.     let resultData: BaseResp = JSON.parse(httpResponse.result.toString())
20.     if (httpResponse.responseCode == 200) {
21.       responseData.code = resultData.code
22.       responseData.message = resultData.message
23.       responseData.data = resultData.data
24.     } else {
25.       responseData.message = `接口请求失败:${httpResponse.responseCode}`
26.     }
27.     return responseData
28.   }).catch(() => {
29.     responseData.message = 'Http请求异常'
30.     return responseData
31.   })
32. }

复制代码

post和get的唯一差异就是extraData
这一段是post带token

1. export async function httpRequestPOSTWithToken(url: string, params?: object): Promise<BaseResp> {
2.   //获取token
3.   let tokenValue = DPUtil.getValue('token')
4.   //创建Http的请求对象
5.   let httpRequest = http.createHttp()
7.   //发起请求
8.   let responseResult = httpRequest.request(url, {
9.     method: http.RequestMethod.POST,
10.     header: {
11.       'Content-Type': 'application/jason;charset = utf-8',
12.       'token': tokenValue
13.     },
14.     extraData: params ? params : '',
15.     connectTimeout: 10000,
16.     readTimeout: 10000,
17.   })
18.   let responseData = new BaseResp()
19.   //解析返回数据
20.   return responseResult.then((httpResponse: http.HttpResponse) => {
21.     LogUtil.info(httpResponse.result.toString())
22.     let resultData: BaseResp = JSON.parse(httpResponse.result.toString())
23.     if (httpResponse.responseCode == 200) {
24.       responseData.code = resultData.code
25.       responseData.message = resultData.message
26.       responseData.data = resultData.data
27.     } else {
28.       responseData.message = `接口请求失败:${httpResponse.responseCode}`
29.     }
30.     return responseData
31.   }).catch(() => {
32.     responseData.message = 'Http请求异常'
33.     return responseData
34.   })
35. }

复制代码

---

总结

通过对网络哀求举行封装可以加深对底层的理解,后续可以直接使用官方的网络哀求框架

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。