学着学着 我就给这个 HarmonyOS 应用增加了些新技术

学着学着 我就给这个 HarmonyOS 应用增加了些新技术

前言

学习技术最好基本的过程分为两个阶段：

1. 输入阶段
2. 输出阶段

输入阶段，就是你如何获取知识和吸收知识的过程，因人而异，看书、看视频、看代码、看文章等等方式。

输出阶段，就是体现出你知道的内容输出成客观的存在的东西，可以是写文章博客、输出教程视频、教会别人、落地到你的项目中。

在我平时的输出方式，以上都包含了，那么今天输出的方式就是落地到具体到项目中了

今天主要做了什么呢

今天主要是使用HarmonyOS 端云的能力和元服务的静默能力，对已经上架的项目 萤火故事屋 做了一些升级优化

静默登录

静默登录就像你走进自己家一样自然，不需要钥匙，也不需要输密码——系统直接认出你是主人，自动开门让你进去。

1. 场景

   ：你之前用华为账号登录过某个应用（比如游戏、社交软件），后来手机丢了、重装了应用，或者换了新手机。

   

2. 操作：当你重新下载应用打开时，不需要手动输入账号密码，甚至不需要点击“登录”按钮。

3. 结果：应用直接记住你的身份（比如你的华为账号信息），自动帮你完成登录，就像从未离开过一样。

端云一体

端云一体就是HarmonyOS提供一套完整的后端环境，包括：云数据库、云存储、云函数等能力。

这里我们的使用端云是存储了用户的个人信息，包括身份验证的token，头像和昵称等。

场景化Button

场景化Button是 HarmonyOS 中 **Scenario Fusion Kit（融合场景服务）**中的一个分支。

**Scenario Fusion Kit（融合场景服务）**基于ArkUI框架组件开发，提供跨多个子系统融合的场景化组件，降低开发者接入复杂度，确保鸿蒙生态体验统一。ArkUI一行核心代码启用，智能推荐输入建议，复杂表单一键填充。融合场景服务通过完善应用/元服务的系统开发能力，进一步丰富鸿蒙生态，满足开发者在HarmonyOS系统下的服务闭环诉求。

选择头像Button 是场景化Button中的一个分类，开发者可以Button组件快速拉起头像选择页面，供用户完成华为账号头像或其他头像的选择与展示

整体效果

核心代码

这里罗列了关键功能的部分核心代码

鸿蒙端 静默登录

  /*** 华为静默登录* @returns*/async hwLoginRequest() {// 创建登录请求，并设置参数const loginRequest = new authentication.HuaweiIDProvider().createLoginWithHuaweiIDRequest();// false表示静默登录loginRequest.forceLogin = false;// 用于防跨站点请求伪造loginRequest.state = util.generateRandomUUID();const controller = new authentication.AuthenticationController();const response = await controller.executeRequest(loginRequest);const loginWithHuaweiIDResponse = response as authentication.LoginWithHuaweiIDResponse;const state = loginWithHuaweiIDResponse.state;if (state && loginRequest.state !== state) {hilog.error(0x0000, 'testTag', `Failed to login. The state is different, response state: ${state}`);return;}const loginWithHuaweiIDCredential = loginWithHuaweiIDResponse!.data;return loginWithHuaweiIDCredential!}

代码解释：

功能：实现华为账号的静默登录功能，并验证请求的合法性
目的：通过华为账号系统进行用户身份认证，获取用户凭证信息
使用场景：在鸿蒙应用中需要用户身份验证时（如访问个人数据、执行敏感操作等）

主要逻辑：

1. 创建登录请求对象
   • 使用authentication.HuaweiIDProvider创建华为账号登录请求实例
   • 设置forceLogin = false表示尝试静默登录（若用户已登录则直接获取凭证）
   • 生成随机UUID作为state参数，用于防止CSRF攻击
2. 执行认证请求
   • 通过AuthenticationController执行登录请求
   • 使用await等待异步操作完成，符合ArkTS的异步编程特性
3. 响应验证
   • 检查响应中的state参数是否与请求时设置的值一致
   • 使用hilog记录错误日志（当state不匹配时）
   • 通过类型断言as authentication.LoginWithHuaweiIDResponse确保类型安全
4. 获取登录凭证
   • 从响应数据中提取loginWithHuaweiIDCredential
   • 使用非空断言!确保返回值不为null（需确保业务逻辑已处理异常情况）

鸿蒙端 调用云函数 生成Access_Token

这里的业务需求是，我们需要获取静默登录返回的code，这个code是当前登录用户的身份验证，有效期为1分钟，并且只能使用一次，我们需要根据它来得到自己业务服务器颁发的token，后续用到自己的业务时，便是根据这个token来进行身份验证的。详细开发流程如下图。

代码：

  /*** 登录*/async login(authorizationCode: string,OpenID:string) {const res = await cloudFunction.call({// 云对象的名称，这个和你创建的云对象文件名一致name: "auth-cloud",data: {// book云对象的methods1方法method: "login",// 传递给method1的参数params: [authorizationCode,OpenID],},})return res}

解释如下：

1. 功能：通过调用云函数实现用户登录验证
   目的：将用户授权码和OpenID传递至云端进行安全验证，并获取登录结果
   使用场景：移动应用（如鸿蒙应用）中用户通过第三方授权（如OAuth）登录时，与后端云服务交互的场景

   主要逻辑：

   1. 异步函数声明：使用async关键字声明函数，支持异步调用云函数并等待响应结果
   2. 参数传递：接收授权码authorizationCode和用户标识OpenID作为输入参数，用于身份验证
   3. 云函数调用：通过框架提供的 cloudFunction.call接口：
      • 指定云对象名称auth-cloud（需与云端部署的云函数名称一致）
      • 通过method字段指定调用云端的login方法
      • 通过params数组传递验证所需的两个关键参数
   4. 结果返回：将云端返回的响应结果直接透传给调用方，保持请求-响应的透明性
   5. 类型安全：基于ArkTS的静态类型特性，对输入参数和返回值类型进行编译时检查（string类型参数，Promise封装的响应结果）

云函数端 根据 鸿蒙端code 生成 Access_token

云函数接收客户端传递过来的code，需要向华为服务器申请获取 Access Token和 Refresh Token，这里的 AccessToken的功能是向华为服务器获取当前用户的敏感革新，头像、名称等。

  login(authorizationCode: string,openID:string) {// 生成 Tokenconst payload = { authorizationCode ,openID};const token = generateToken(payload, '1h');console.log('生成的 Token:', token);return token}

总结

​ 以上是我们部分核心代码的展示，然后萤火故事屋的端云改造还没有结束，目前技术方案上还存在一些问题没有解决：

1. 云数据库、云函数、云存储中开发环境和生成环境，端云如何快速便捷的切换
2. 本地真机如何和本地函数联动调试，因为生成用户的code是和真机调用静默登录返回的内容相关的，因此需要打通这个关系。