抛弃床的温暖,只为了它丨云库一款跑在鸿蒙系统上的应用

系统
文章由鸿蒙社区产出,想要了解更多内容请前往:51CTO和华为官方战略合作共建的鸿蒙技术社区https://harmonyos.51cto.com/#zz

[[380860]]

想了解更多内容,请访问:

51CTO和华为官方合作共建的鸿蒙技术社区

https://harmonyos.51cto.com/#zz

前文再续,章节上篇。

在篇一,对整个项目要做什么,达到什么样的效果等做了简单的分析。本节将从服务端API约定、登录(没有注册,登录即注册)流程、长连接、华为云对象存储OBS基本概念介绍等对整个项目的技术层面做详细的介绍。

本节内容摘要:

1、约定服务端API返回结构

2、登录流程

3、华为云对象存储OBS介绍

4、HAP输入手机号获取验证码

约定服务端API返回结构 

封装一个好的返回结构,使得我们在处理数据的时候能够减少各种拆解。因此在初期搭建完服务端项目后,首要做的是封装一套合理的返回数据结构,使API返回结构体大体相似。

1)使用Java Enum枚举类,将公用的返回错误进行封装,比如请求接口成功,请求接口失败,登录验证成功等等。 

  1. package com.ming.harmonyos.photokit.conf; 
  2.  
  3. /** 
  4.  * 枚举类对象 
  5.  */ 
  6. public enum StatusCode { 
  7.  
  8.     //公共 
  9.     SUCCESS(200, "成功"), 
  10.     FAILED(9999, "失败"), 
  11.     UNKNOWN_ERROR(9998, "未知异常"), 
  12.     SYSTEM_ERROR(9997, "系统异常"), 
  13.  
  14.     REQUEST_PARAMETER_ERROR(1001, "请求参数错误"), 
  15.     REQUEST_ACCESS_TOKEN_ERROR(1002, "请求参数token值错误"), 
  16.  
  17.     //手机号校验 
  18.     CHECK_CELL_PHONE_NUM_ERROR(2001, "手机号码输入错误"), 
  19.     LOGIN_VALID_CODE_ERROR(2002, "登录验证码错误"), 
  20.     LOGOUT_ERROR(2003, "退出失败"), 
  21.     LOGOUT_AUTH_ERROR(2004, "退出失败,token不存在"); 
  22.  
  23.     /** 
  24.      * 状态码 
  25.      */ 
  26.     private int code; 
  27.  
  28.     /** 
  29.      * 状态消息 
  30.      */ 
  31.     private String message; 
  32.  
  33.     StatusCode(int code, String message) { 
  34.         this.code = code; 
  35.         this.message = message; 
  36.     } 
  37.  
  38.     public int getCode() { 
  39.         return code; 
  40.     } 
  41.  
  42.     public String getMessage() { 
  43.         return message; 
  44.     } 

 2)、封装一套API返回的数据结构

我目前使用的有两种,一种是以true|false做请求状态,另一种是以数字的形式做请求状态。两种各有千秋,第一种相对第二种的话要做到具体的异常定位需要在返回消息中加入异常码。本项目只是简单的示例项目,因此我选择第二种,这种方便控制。 

  1. package com.ming.harmonyos.photokit.conf; 
  2.  
  3. import lombok.Data; 
  4.  
  5. import java.io.Serializable
  6.  
  7. /** 
  8.  * 返回结果类统一封装 
  9.  */ 
  10. @Data 
  11. public class ApiResultInfo<T> implements Serializable { 
  12.  
  13.     /** 
  14.      * 状态码 
  15.      */ 
  16.     private Integer code; 
  17.     /** 
  18.      * 消息 
  19.      */ 
  20.     private String message; 
  21.  
  22.     /** 
  23.      * 数据对象 
  24.      */ 
  25.     private T data; 
  26.  
  27.     public ApiResultInfo() { 
  28.     } 
  29.  
  30.     public ApiResultInfo(Integer code, String message, T data) { 
  31.         this(); 
  32.         setCode(code); 
  33.         setMessage(message); 
  34.         setData(data); 
  35.     } 
  36.  
  37.     public static <T> ApiResultInfo<T> getFailedInstant(Integer code, String message, T data) { 
  38.         return new ApiResultInfo<>(code, message, data); 
  39.     } 
  40.  
  41.     public static <T> ApiResultInfo<T> getInstant(T data) { 
  42.         return new ApiResultInfo<>(StatusCode.SUCCESS.getCode(), 
  43.                 StatusCode.SUCCESS.getMessage(), data); 
  44.     } 

3)示例接口

这里只是一个登录(同时也是注册)接口,其他接口暂时未公开。

接口信息 

  1. 接口地址:http://xxx/yunku/login.do  
  2. 请求示例:http://xxx/yunku/login.do  
  3. 支持协议:HTTP/HTTPS  
  4. 请求方式:POST  
  5. 返回格式:UTF8 JSON 

请求参数 

 

返回示例 

  1.     "code": 200, 
  2.     "msg""success"
  3.     "data": { 
  4.         "authCode""xxxxxx"
  5.         "userInfo": { 
  6.             "iId": 1, 
  7.             "sPhone""13800000000"
  8.             "sNickName""yx_13800000000"
  9.            "sPath""http://xxxx/yx_default.png"
  10.            "dVolume": 20, 
  11.            "dUsedVolume": 5, 
  12.            "tEdit""2021-01-20"  
  13.         } 
  14.     } 

 返回参数 

 

登录流程

登录即注册,用户第一次登录,验证通过后将用户信息以key-value的形式存入到Redis缓存中。如果是再次登录则存入新值,用户缓存有效期7天。  

 

华为云对象存储OBS介绍

对象存储服务(Object Storage Service,OBS)提供海量、安全、高可靠、低成本的数据存储能力,可供用户存储任意类型和大小的数据。适合企业备份/归档、视频点播、视频监控等多种数据存储场景。我们这里只是用于存储多媒体文件。

对于现阶段,我们只需要了解OBS的桶、对象两个概念。桶是存储对象的容器,对象是数据存储的基本单位。可以对应我们系统的文件管理来看,桶相当于磁盘,比如D盘,在D盘根目录下只能存在一个同类型的文件,而对象就相当于文件夹中的文件。

而云库中,用于可以通过HAP创建多个云库(桶),在云库中上传多媒体文件。

HAP输入手机号获取验证码

这也是云库HAP的主页面,启动云库HAP后,进入应用首先看到的界面。对于登录页面,大体都是一样的,录入框和交互按钮是页面主要呈现的组件,额外会添加一些Image和Text组件,这里我们仅使用下表中罗列的组件来构建页面。 

 

  1. <?xml version="1.0" encoding="utf-8"?> 
  2. <DependentLayout 
  3.     xmlns:ohos="http://schemas.huawei.com/res/ohos" 
  4.     ohos:height="match_parent" 
  5.     ohos:width="match_parent" 
  6.     ohos:background_element="#FFFFFF"
  7.     <Image 
  8.         ohos:id="$+id:logo" 
  9.         ohos:height="100vp" 
  10.         ohos:width="100vp" 
  11.         ohos:image_src="$media:logo" 
  12.         ohos:horizontal_center="true"/> 
  13.  
  14.     <Text 
  15.         ohos:id="$+id:hello" 
  16.         ohos:height="match_content" 
  17.         ohos:width="match_content" 
  18.         ohos:text="欢迎走近云库" 
  19.         ohos:top_margin="40vp" 
  20.         ohos:left_margin="20vp" 
  21.         ohos:right_margin="20vp" 
  22.         ohos:text_size="30fp" 
  23.         ohos:below="$+id:logo"/> 
  24.  
  25.     <TextField 
  26.         ohos:id="$+id:phoneNum" 
  27.         ohos:height="match_content" 
  28.         ohos:width="match_parent" 
  29.         ohos:hint="请输入手机号..." 
  30.         ohos:text_size="20fp" 
  31.         ohos:text_alignment="vertical_center" 
  32.         ohos:top_margin="10vp" 
  33.         ohos:left_margin="20vp" 
  34.         ohos:right_margin="20vp" 
  35.         ohos:top_padding="16vp" 
  36.         ohos:bottom_padding="16vp" 
  37.         ohos:basement="#E1E1D2" 
  38.         ohos:text_input_type="pattern_number" 
  39.         ohos:below="$+id:hello"/> 
  40.  
  41.     <Button 
  42.         ohos:id="$+id:get_valid_code_btn" 
  43.         ohos:height="match_content" 
  44.         ohos:width="match_parent" 
  45.         ohos:text="获取验证码" 
  46.         ohos:text_size="20fp" 
  47.         ohos:bottom_margin="20vp" 
  48.         ohos:left_margin="20vp" 
  49.         ohos:right_margin="20vp" 
  50.         ohos:top_padding="12vp" 
  51.         ohos:bottom_padding="12vp" 
  52.         ohos:align_parent_bottom="true" 
  53.         ohos:text_color="#F2F2F2" 
  54.         ohos:background_element="$graphic:background_disabled"/> 
  55.  
  56. </DependentLayout> 

 

  1. Button button = (Button) findComponentById(ResourceTable.Id_get_valid_code_btn); 
  2. TextField inputPhoneNum = (TextField) findComponentById(ResourceTable.Id_phoneNum); 
  3. inputPhoneNum.setTextInputType(InputAttribute.PATTERN_NUMBER); 
  4. inputPhoneNum.addTextObserver(new Text.TextObserver() { 
  5.     @Override 
  6.     public void onTextUpdated(String s, int i, int i1, int i2) { 
  7.         if (s.length() == 11) { 
  8.             //TODO 判断是否输入的是正确的手机号, 排除输入汉字、标点符号、英文字母等不是数字情况 
  9.             ShapeElement shapeElement = new ShapeElement(getContext(), ResourceTable.Graphic_background_login); 
  10.             button.setBackground(shapeElement); 
  11.             button.setClickable(true); 
  12.         } else { 
  13.             ShapeElement shapeElement = new ShapeElement(getContext(), ResourceTable.Graphic_background_disabled); 
  14.             button.setBackground(shapeElement); 
  15.             button.setClickable(false); 
  16.         } 
  17.     } 
  18. }); 
  19.  
  20. button.setClickedListener(l -> { 
  21.     if (l.isClickable()) { 
  22.         //TODO 执行获取验证码接口,返回数据成功后跳转到验证码输入页面 
  23.     } 
  24. }); 

由于后端程序还未部署到服务器上,这里接口调用暂时还未编写。后续整个项目公开后,可以查看具体源码,敬请期待!!!

想了解更多内容,请访问:

51CTO和华为官方合作共建的鸿蒙技术社区

https://harmonyos.51cto.com/#zz 

 

责任编辑:jianghua 来源: 鸿蒙社区
相关推荐

2021-01-29 15:47:21

鸿蒙HarmonyOS云库

2021-01-07 11:32:43

鸿蒙HarmonyOS计算器

2023-10-06 14:27:10

Linux系统监控

2024-08-16 08:31:05

2015-07-30 09:42:35

云计算云服务iBM

2011-09-19 14:45:18

iPhone应用软件Doxo

2018-07-23 14:46:28

办公电话

2013-12-18 17:16:29

2014-01-13 15:00:51

InxiLinux硬件

2011-09-19 11:07:20

iPhone应用CardFlick

2022-02-25 14:57:33

harmonyOSjava心形动画

2021-08-31 07:54:23

数据库选型

2010-03-04 09:25:48

Ubuntu VMwa

2014-06-27 14:53:06

应用App产品

2013-11-26 10:51:08

开发应用创业移动应用

2012-04-28 10:57:27

Metro UI

2011-09-16 13:44:19

Android应用我要搜APP

2011-09-08 17:31:29

Steply社交图片

2018-09-10 13:55:19

2018-09-04 23:28:06

点赞
收藏

51CTO技术栈公众号