如何集成Babka登录管理器

运行机制

您可以在您的网站上添加通过Babka登录管理器使用Babka中的用户帐户进行用户认证。集成方法有以下几种:

  • Babka帐户按钮。如使用此方法:
    • 无需在您的发布商帐户中创建和设置艾克索拉授权项目。
    • 您需要在您的应用程序服务器侧实现用授权代码交换用户授权令牌。

  • 艾克索拉登录管理器小组件中将Babka登录管理器作为一个社交网络。如使用此方法:
    • 需要在您的发布商帐户中创建并设置艾克索拉登录管理器项目。
    • 您可以立即在您的网站上收到用户授权令牌。

注:
上图显示了登录小组件的方案之一。您可以自定义小组件
注:
您可以同时使用这两种集成方法。

集成Babka帐户按钮

要集成Babka帐户按钮:

  1. 创建Babka登录管理器OAuth 2.0客户端
  2. 在您的应用程序侧集成Babka登录管理器按钮
  3. 实现用户授权令牌的检索

创建Babka登录管理器OAuth 2.0客户端

要创建Babka OAuth 2.0客户端:

  1. 联系您的项目帐户经理并提供以下信息:

参数类型示例描述
Redirect URIs字符串数组[“https://example.com/oauth/callback”, “http://localhost:3000/oauth/callback”]可用于在用户通过Babka登录管理器认证后将其重定向到的URI地址列表。
Audience字符串“https://example.com”Babka登录管理器将使用的域名。
Scope字符串数组[“email”, “transactions”]Babka中的权限列表。

  1. 艾克索拉集成团队将为您创建一个Babka Oauth 2.0客户端并为您提供其ID和密钥。这些数据在获取用户授权令牌时需用到。

在应用程序侧集成Babka帐户按钮

请使用Babka Login SDK在您的应用程序侧集成Babka帐户按钮。

获取用户授权令牌

在Babka登录管理器侧授权后,用户将被重定向到redirect_uri参数中指定的URI地址。要获取用户授权令牌,请参阅此说明。要在用户授权令牌过期后刷新令牌,请参阅此说明

将Babka登录管理器作为社交网络进行集成

要将Babka登录管理器作为社交网络进行集成:

  1. 创建Babka登录管理器OAuth 2.0客户端
  2. 将Babka登录管理器作为社交网络启用
  3. 集成登录管理器小组件
  4. 实现用户授权令牌的检索

创建Babka登录管理器OAuth 2.0客户端

要创建Babka登录管理器OAuth 2.0客户端:

  1. 在发布商帐户中创建一个项目
  2. 在发布商帐户中设置登录管理器项目
  3. 联系您的帐户经理并提供以下信息:

参数类型示例描述
Redirect URIs字符串数组[“https://example.com/oauth/callback”, “http://localhost:3000/oauth/callback”]可用于在用户通过Babka登录管理器认证后将其重定向到的URI地址列表。
Audience字符串“https://example.com”Babka登录管理器将使用的域名。
Scope字符串数组[“email”, “transactions”]Babka中的权限列表。

  1. 艾克索拉集成团队将为您创建一个Babka Oauth 2.0客户端并为您提供其ID和密钥。这些数据在获取用户授权令牌时需用到。

集成登录管理器小组件

请使用SDK集成登录管理器小组件。

将Babka登录管理器作为社交网络启用

  1. 发布商帐户中打开您的项目,然后前往登录管理器部分。
  2. 在登录管理器项目面板中单击配置
  3. 在导航页上,前往身份认证部分,然后选择社交网络登录部分。
  4. 在社交网络列表中选择Babka

  1. 单击⚙图标,然后选择设置
  2. 填写以下字段:
    • 应用程序ID — 从艾克索拉收到的Babka登录管理器OAuth 2.0客户端ID。
    • 应用程序密钥 — 从艾克索拉收到的Babka登录管理器OAuth 2.0。
    • 允许的资源 — 发送用授权代码交换用户授权令牌请求的网站。请指定创建Babka登录管理器OAuth 2.0客户端时在Audience参数中指定的同一个URL地址。

  1. 单击连接
  2. 启用使用Babka登录管理器弹窗(可选):
    1. 在导航页上,前往身份认证部分,然后选择回调URL部分。
    2. 回调URL字段,输入https://login-widget.xsolla.com/latest/babka-auth-succeed
    3. 在登录管理器小组件代码中在babkaLoginPopup参数中传入true值;在callbackUrl参数中传入用户认证完成后将其重定向到的页面的URL地址。

小组件代码示例:

Copy
Full screen
Small screen

import { Widget } from '@xsolla/login-sdk';
const xl = new Widget({
  projectId: '[Login ID]',
  preferredLocale: 'en_US',
  babkaLoginPopup: true,
  callbackUrl: '[Your Callback URL]',
});

    1. 在您的网站上添加Babka帐户按钮。

Babka帐户按钮代码示例:

Copy
Full screen
Small screen

<div id="xl_auth"></div>
<button onclick="xl.open()">Babka Login Popup</button>

获取用户授权令牌

在Babka登录管理器侧授权后,用户将被重定向到callback_url参数中指定的URL。用户授权令牌token参数中传递。

要在艾克索拉登录管理器JWT令牌中嵌入Babka登录管理器OAuth JWT令牌:

  1. 发布商帐户中打开您的项目,然后前往登录管理器部分。
  2. 在登录管理器项目面板中单击配置
  3. 在导航页上,前往身份认证部分,然后选择社交网络登录部分。

  1. 嵌入社交网络JWT令牌开关设置为
  2. 单击保存更改

本文对您的有帮助吗?
谢谢!
我们还有其他可改进之处吗? 留言
非常抱歉
请说明为何本文没有帮助到您。 留言
感谢您的反馈!
我们会查看您的留言并运用它改进用户体验。
为此页面评分
为此页面评分
我们还有其他可改进之处吗?

不想回答

感谢您的反馈!
上次更新时间: 2023年5月30日

发现了错别字或其他内容错误? 请选择文本,然后按Ctrl+Enter。

报告问题
我们非常重视内容质量。您的反馈将帮助我们做得更好。
请留下邮箱以便我们后续跟进
感谢您的反馈!