HarmonyOS 鸿蒙Next中支付宝登录

问题描述

HarmonyOS开发如何接入支付宝账号登录。

解决方案

在支付宝创建移动应用，申请appID,开通支付宝登录能力。配置sdk，配置依赖，修改根目录 oh-package.json5 依赖路径，然后在 IDE - Terminal 执行一下：ohpm install

{
  "dependencies": {
    "@alipay/afservicesdk": "file:./AFServiceSDK/AFServiceSDK.har"
  }
}

配置module.json5文件

{
  "module": {
    ....
    // 新增
    "querySchemes": [
      "apmqpdispatch"
    ],
    "abilities": [
     ....
    ]
  }
}

配置回调，EntryAbility.ets的onNewWant增加回调结果处理。

 onNewWant(want: Want, launchParam: AbilityConstant.LaunchParam): void {
    let r = AFServiceCenter.handleResponse(want);
  }

代码实现

// 1.引入基础模块
import { AFServiceParams, AFWantParams, AFServiceCenter, AFAuthServiceResponse, AFService } from '@alipay/afservicesdk';
@Entry
@Component
struct Index {
  build() {
    Row() {
      Column() {
        Button("支付宝登录")
          .onClick(() => {
            this.authorize()
          })
      }
      .width('100%')
    }
    .height('100%')
  }

  /**
   * 授权操作
   */
  authorize() {
    // 1.设置支付宝登录后回跳地址参数
    let backWant: AFWantParams = {
      bundleName: "com.example.notify",//换成自己应用的包名
      moduleName: "entry",
      abilityName: "EntryAbility"
    }
    // 2.构建请求参数
    let bizParams = new Map<string, string>()
    let url = encodeURIComponent(`https://authweb.alipay.com/auth?auth_type=PURE_OAUTH_SDK&app_id=2016051801417322&scope=auth_user&state=init`)
    bizParams.set("url", url);
    let params = new AFServiceParams(bizParams, false, true, 'scheme:demo', backWant, (response: AFAuthServiceResponse) => {
        console.info('response1' + JSON.stringify(response));
        let parameters =  response.result!.parameters
        console.info('response2' + JSON.stringify(parameters));
      })
    // 3.唤起支付宝App支付宝进行登录,如果没有安装app回进入h5页面提示安装，如果已经安装直接拉起支付宝授权登录
    AFServiceCenter.call(AFService.AFServiceAuth, params)
  }
}