华为HarmonyOS实现跨多个子系统融合的场景化服务 -- 1 构建快速验证手机号Button

场景介绍

快速验证手机号Button功能用于帮助开发者向用户发起手机号申请，应用在满足《常见类型移动互联网应用程序必要个人信息范围规定》（对第三方网站的内容，华为公司不承担任何责任）中使用手机号的必要业务场景，经用户同意后，应用可获取手机号，为用户提供相应服务（详见场景介绍）。

说明

应用/元服务仅在首次使用时需要用户进行授权，授权成功后，后续只验证授权手机号，不可修改。

前提条件

参见开发前提。

效果图展示

单击“快速验证手机号”按钮，拉起验证界面（完整流程可参考手机号快速验证）。

开发步骤

1. 导入Scenario Fusion Kit模块以及相关公共模块。
   1. import { FunctionalButton, functionalButtonComponentManager } from '@kit.ScenarioFusionKit';
   2. import { hilog } from '@kit.PerformanceAnalysisKit';

2. 在容器中声明FunctionalButton，指定Button的openType，并设置对应的回调函数，代码如下：
   1. @Entry
   2. @Component
   3. struct Index {
   4. build() {
   5. Row() {
   6. Column() {
   7. // 声明FunctionalButton
   8. FunctionalButton({
   9. params: {
   10. // OpenType.GET_PHONE_NUMBER表示Button为快速验证手机号类型
   11. openType: functionalButtonComponentManager.OpenType.GET_PHONE_NUMBER,
   12. label: '快速验证手机号',
   13. // 调整Button样式
   14. styleOption: {
   15. styleConfig: new functionalButtonComponentManager.ButtonConfig()
   16. .fontSize(20)
   17. .fontColor(Color.Black)
   18. },
   19. },
   20. // OpenType为“GET_PHONE_NUMBER”时，回调必须选择“onGetPhoneNumber”
   21. controller: new functionalButtonComponentManager.FunctionalButtonController()
   22. .onGetPhoneNumber((err, data) => {
   23. if (err) {
   24. // 错误日志处理
   25. hilog.error(0x0000, "testTag", "error： %{public}d %{public}s", err.code, err.message);
   26. return;
   27. }
   28. // 成功日志处理
   29. hilog.info(0x0000, "testTag", "succeeded in authenticating");
   30. // 开发者处理AuthorizationCode
   31. let authorizationCode = data.code;
   32. })
   33. })
   34. }
   35. .width('100%')
   36. }
   37. .height('100%')
   38. }
   39. }

   说明

   • openType参数填写“functionalButtonComponentManager.OpenType.GET_PHONE_NUMBER”指定Button为快速验证手机号类型。
   • controller参数必须对应填写“new functionalButtonComponentManager.FunctionalButtonController().onGetPhoneNumber”。
   • 若成功调用，可通过回调函数中的临时登录凭证（Authorization Code）获取真实手机号，临时登录凭证时效5分钟，具体操作可参考服务端开发。

   其他参数请参考：FunctionalButton（Button组件）。