跳到主要内容

Web

本文旨在介绍如何设置 LINE 身份验证,让您的网页可以使用 Player Network 登录鉴权服务通过 LINE 渠道登录。

前提条件

1. 在 LINE Developers Console 上设置 LINE 应用

1. 创建 LINE 应用并配置渠道

在为所需平台配置应用程序之前,请登录 LINE Developers Console 并创建开发者账号。使用开发者账号,使用 LINE Developers Console 并创建一个渠道(LINE 功能与您的应用程序之间的通信渠道)。

创建一个渠道
  1. 在 Console 主页上,点击 Create New Provider,然后按照屏幕上的说明创建提供商。

    图片:Create a LINE Provider

  2. 在提供商页面的 Channels 选项卡中,点击 Create a LINE Login channel

  3. 在新渠道创建页面,输入所需信息并点击 Create

  4. 在渠道页面的 Basic settings 选项卡中,选中 Channel ID 和其他 Player Network SDK 配置所需的信息。

    图片:Add LINE app information

  5. 为网页应用配置渠道。
    在渠道页面的 LINE Login 选项卡中,启用 Web app 并输入所需信息。

    图片:LINE Windows

  6. 点击 Update 保存配置。

2. 添加用户权限

创建渠道后,该渠道会立即设置为 Developing 模式。只有渠道管理员和测试人员可以使用 LINE 登录功能。

添加测试人员
  1. 登录 LINE Developers Console

  2. 从主页上最近访问过的渠道中选择相应渠道。

    图片:Select LINE channel

  3. 在渠道页面,点击 Roles

  4. Roles 选项卡中,点击 Invite by email

    图片:LINE permission configuration

  5. Invite new members 部分添加测试人员。
    Email:测试者的 LINE 账号
    Role: 测试员

    图片:Add LINE tester

  6. 点击 Send Invitations 发送测试人员邀请。

  7. 等待测试人员接受电子邮件邀请。

  1. 获取 Player Network 控制台登录账号
  2. 为游戏创建新项目,或加入已有项目
  3. 在 Player Network 控制台添加 LINE 为业务的登录鉴权方式
注意

更多关于其他第三方渠道接入 SDK 的信息,请参见 JavaScript SDK

步骤1:引⼊ JavaScript SDK

目前已支持 npm 包方式和 CDN 方式。

$ npm install @intlsdk/account-api

步骤2:使用 SDK

警告

在集成测试时,将 env 设置为测试环境;项目上线时,将 env 设置为相应的正式环境。

const accountApi = new IntlgameAccountApi({
env: "test", // SDK environment
gameID: 11,
});
参数类型描述备注
envstringSDK 环境
更多信息,请参见 获取部署集群信息
必填
gameIDnumberPlayer Network 游戏唯一标识 ID必填

步骤3:实现网页登录

实例化 accountApi 组件后,调用 thirdAuthorize 接口申请 LINE 渠道的登录授权令牌。

accountApi.thirdAuthorize({
third_type: 'line',
}).then(
(res) => {
console.log(res);
});

当 LINE 返回登录授权令牌后,调用 intlAuthorize 接口获取 Player Network SDK OpenID 和令牌登录网站。

accountApi.intlAuthorize({
third_type: 'line',
channel_info: {
access_token: "EAAI2lTrXAZBwBAC",
expires_in: "xxxx",
}
}).then(
(res) => {
console.log(res);
});

调用 intlLogout 接口登出网站。

accountApi.intlLogout({
token: '4567xsdfsd',
openid: 'xxxxxxxx',
channel_id: 14,
}).then(
(res) => {
console.log(res);
});