设置支付宝 (Web) 社交登录
Logto 官方为 Web 应用提供的支付宝社交登录连接器。
提示:
本指南假设你对 Logto 连接器 (Connectors) 有基本的了解。对于不熟悉的人,请参考 连接器 (Connectors) 指南以开始了解。
入门指南
支付宝 Web 连接器专为桌面 Web 应用设计。它利用支付宝的 OAuth 2.0 认证 (Authentication) 流程,使支付宝用户能够使用其公开的支付宝用户信息登录其他应用,无需繁琐的注册流程。
注册支付宝开发者账号
注册支付宝开发者账号(如果你还没有的话)。
创建并配置支付宝应用
- 使用刚刚注册的账号登录 支付宝控制台。
- 在“我的应用”面板中,进入“网页&移动应用”标签页。
- 点击“立即创建”按钮,开始配置你的应用。
- 在“应用名称”中为你的应用命名(需遵循命名规范),并上传“应用图标”,确保“应用类型”选择为“网页应用”。
- 创建应用后,进入概览页面,点击“添加能力”,添加“第三方应用授权”、“获取会员信息”和“App 支付宝登录”,以启用支付宝登录。
- 前往 支付宝商家中心,使用支付宝开发者账号登录。点击顶部栏的“账号中心”,进入侧边栏底部的“APPID 绑定”,输入你在第 4 步创建的 Web 应用的 APPID,点击“添加绑定”。
- 在“App 支付宝登录”处点击“签约”按钮,按照指引完成签约流程。完成后,你会发现第 5 步添加的能力已生效。
- 返回支付宝开放平台控制台页面,在“开发信息”部分可以找到“接口加签方式(密钥/证书)”。点击“设置”按钮,进入签名方式设置页面。推荐选择“公钥”模式,并将你生成的公钥文件内容填入文本框。
- 在支付宝控制台页面底部,点击“设置”按钮,设置“授权回调地址”。
${your_logto_origin}/callback/${connector_id}是 Logto 核心默认使用的回调地址。connector_id可在 Logto 管理后台连接器详情页顶部栏找到。 - 完成上述所有步骤后,返回支付宝控制台页面右上角,点击“提交审核”。审核通过后,你就可以顺利使用支付宝登录流程了。
备注:
你可以在本地通过以下命令使用 openssl 生成密钥对。
openssl genrsa -out private.pem 2048
openssl rsa -in private.pem -outform PEM -pubout -out public.pem
在支付宝应用配置页面填写公钥时,需要去除 public.pem 文件的头部和尾部,删除所有换行符,并将剩余内容粘贴到“公钥”文本框中。
配置 Logto 支付宝 Web 连接器设置
- 在 支付宝控制台工作区 的“我的应用”面板,点击“网页&移动应用”标签页,可以找到所有应用的 APPID。
- 在前述第 7 步,你已经生成了一对密钥,包括私钥和公钥。
- 填写 Logto 连接器设置:
appId字段填写第 1 步获取的 APPID。privateKey字段填写第 2 步生成的私钥文件内容。请确保用 '\n' 替换所有换行符,并且不要移除私钥文件的头部和尾部。signType字段填写 'RSA2',因为我们在“创建并配置支付宝应用”第 7 步选择了公钥签名模式。charset字段填写 'gbk' 或 'utf8',此字段为可选项,默认值为 'utf8'。scope字段填写 'auth_base' 或 'auth_user',此字段为可选项,默认值为 'auth_user'。你可以查看不同取值的区别。
配置类型
| 名称 | 类型 | 枚举值 |
|---|---|---|
| appId | string | N/A |
| privateKey | string | N/A |
| signType | enum string | 'RSA' | 'RSA2' |
| charset | enum string (可选) | 'gbk' | 'utf8' | undefined |
| scope | enum string (可选) | 'auth_user' | 'auth_base' |
测试支付宝 Web 连接器
就是这样。别忘了在注册和登录中启用社交连接器。
启用支付宝 Web 连接器后,你可以构建并运行你的 Web 应用,检查其是否正常工作。