跳到主要内容

设置 Alipay 社交登录

Logto 官方连接器用于移动设备原生应用中的 Alipay 社交登录。

提示:

本指南假设你对 Logto 连接器 (Connectors) 有基本的了解。对于不熟悉的人,请参考 连接器 (Connectors) 指南以开始了解。

开始

Alipay Native 连接器与 Logto SDK 在移动平台上紧密合作。它利用 Alipay 的 OAuth 2.0 认证 (Authentication) 工作流程,使 Alipay 用户能够使用公共 Alipay 用户资料登录其他应用,而无需经过繁琐的注册过程。

注册 Alipay 开发者账号

注册一个 Alipay 开发者账号 如果你还没有的话。

创建和配置 Alipay 应用

  1. 使用你刚注册的账号登录 Alipay 控制台
  2. 在“我的应用” (我的应用) 面板中,转到“网页&移动应用” (网页&移动应用) 标签。
  3. 点击“立即创建” (立即创建) 按钮开始配置你的应用。
  4. 在“应用名称” (应用名称) 中根据命名约定命名你的应用,并上传你的“应用图标” (应用图标),确保选择“移动应用” (移动应用) 作为“应用类型” (应用类型)。对于构建 iOS 应用,需要一个唯一的“Bundle ID”。此外,Android 应用需要“应用签名” (应用签名) 和“应用包名” (应用包名)。
  5. 完成应用创建后,我们来到概览页面,在启用 Alipay 登录之前,我们应该点击“添加能力” (添加能力) 来添加“第三方应用授权” (第三方应用授权)、“获取会员信息” (获取会员信息) 和“App 支付宝登录” (App 支付宝登录)。
  6. 前往 Alipay 客户中心,并使用 Alipay 开发者账号登录。点击顶部栏的“账号中心” (账号中心),然后转到侧边栏底部的“APPID 绑定” (APPID 绑定)。通过输入你在步骤 4 中创建的移动应用的 APPID 来“添加绑定” (添加绑定)。
  7. 点击“App 支付宝登录”的“签约”按钮,并按照指南完成签约过程。完成此步骤后,你应该会发现步骤 5 中刚添加的能力生效。
  8. 返回 Alipay 开放平台控制台页面,你可以在“开发信息” (开发信息) 部分找到“接口加签方式(密钥/证书)” (接口加签方式(密钥/证书))。点击“设置” (设置) 按钮,你会进入一个设置签名方式的页面。“公钥” (公钥) 是首选的签名模式,并在文本输入框中填写你生成的公钥文件的内容。
  9. 通过点击 Alipay 控制台页面底部的“设置” (设置) 按钮来设置“授权回调地址” (授权回调地址)。${your_logto_origin}/callback/${connector_id} 是 Logto 核心中使用的默认重定向 URI。connector_id 可以在 Logto 管理控制台连接器详情页面的顶部栏找到。
  10. 完成所有这些步骤后,返回 Alipay 控制台页面的右上角,点击“提交审核” (提交审核)。一旦审核通过,你就可以顺利进行 Alipay 登录流程。
备注:

你可以使用 openssl 在本地机器上生成密钥对,通过在终端中执行以下代码片段。

openssl genrsa -out private.pem 2048
openssl rsa -in private.pem -outform PEM -pubout -out public.pem

在 Alipay 应用设置网站上填写公钥时,你需要删除 public.pem 的头部和尾部,删除所有换行符,并将其余内容粘贴到“公钥”文本输入框中。

设置 Logto Alipay Native 连接器设置

  1. Alipay 控制台工作区 中,转到“我的应用” (我的应用) 面板并点击“网页&移动应用” (网页&移动应用) 标签,你可以找到所有应用的 APPID。
  2. 在前一部分的步骤 7 中,你已经生成了一个包含私钥和公钥的密钥对。
  3. 填写 Logto 连接器设置:
    • appId 字段中填写你在步骤 1 中获得的 APPID。
    • privateKey 字段中填写步骤 2 中提到的私钥文件的内容。请确保使用 '\n' 替换所有换行符。你不需要删除私钥文件中的头部和尾部。
    • signType 字段中填写 'RSA2',因为我们在“创建和配置 Alipay 应用”步骤 7 中选择了 公钥 签名模式。

配置类型

名称类型枚举值
appIdstringN/A
privateKeystringN/A
signTypeenum string'RSA' | 'RSA2'

在你的应用中启用 Alipay 原生登录

iOS

我们假设你已经在应用中集成了 Logto iOS SDK。在这种情况下,事情非常简单,你甚至不需要阅读 Alipay SDK 文档:

1. 将 LogtoSocialPluginAlipay 添加到你的 Xcode 项目

添加框架:

添加框架
备注:

该插件包括 Alipay “极简版 SDK”。导入插件后,你可以直接使用 import AFServiceSDK

2. 将插件添加到你的 LogtoClient 初始化选项中

let logtoClient = LogtoClient(
useConfig: config,
socialPlugins: [LogtoSocialPluginAlipay(callbackScheme: "your-scheme")]
)

其中 callbackScheme 是可以导航到你的应用的 自定义 URL Schemes 之一。

Android

我们假设你已经在应用中集成了 Logto Android SDK。在这种情况下,事情非常简单,你甚至不需要阅读 Alipay SDK 文档:

1. 下载 Alipay “极简版 SDK” 并将其添加到你的项目中

Logto 第三方社交 SDK 下载 Alipay “极简版 SDK” 到你的项目的 app/libs 文件夹:

project-path/app/libs/alipaySdk-15.7.9-20200727142846.aar

2. 将 Alipay “极简版 SDK” 添加为依赖项

打开你的 build.gradle 文件:

project-path/app/build.gradle

添加依赖项:

dependencies {
// ...
implementation(files("./libs/alipaySdk-15.7.9-20200727142846.aar")) // kotlin-script
// 或者
implementation files('./libs/alipaySdk-15.7.9-20200727142846.aar') // groovy-script
}

测试 Alipay 原生连接器

就是这样。别忘了 在登录体验中启用社交连接器

一旦启用了 Alipay 原生连接器,你可以构建并运行你的应用以查看其是否正常工作。

参考资料

Alipay 文档 - 接入准备 - 如何创建应用 Alipay 文档 - 网页&移动应用 - 创建应用