Web应用接入Line登录

First Post:

Last Update:

Web应用接入Line登录

台湾客户要求在原App的基础上接入Line登录,接入第三方登录的需求工作至今是第一次遇到(毕竟现在手上负责的两个项目都是维护阶段),好在除了登录之后业务的处理之外,登录问题顺利解决了。

接到需求的我第一时间找的是现成的技术分享,但好像比较少,最终我还是选择一点点啃官方的纯英文文档:https://developers.line.biz/en/docs/line-login/getting-started/和https://developers.line.biz/en/docs/line-login/integrate-line-login/

博主身在内地,所以这篇博文,是博主在内地接入Line的文档实践。

开始之前

开始之前有些特殊的名字术语解释如下,我就不翻译了,尽可能保持原汁原味:

Requirement Description
LINE account An account for the LINE app. You need a LINE account to try out the starter app. To create a LINE account, download (opens new window)LINE for iOS or LINE for Android and sign up. For more information about creating a new LINE account, see Create a new account (opens new window)(only available in Japanese) in the LINE user’s guide.
Provider Provider is a concept that describes the person or organization that provides the application. Create a provider on the LINE Developers Console. A LINE user has a different user ID for each provider.
LINE Login channel A channel forms the connection between your app and the LINE Platform. Create a channel within the provider. You need to create a channel for each app. Create a LINE Login channel on the LINE Developers Console.
Notes:
- If you’ve never logged in to the LINE Developers Console, you’ll be asked to register as a developer first.
– The steps for creating your LINE Login channel are explained in Step 1: Create your LINE Login channel.
- When creating a LINE Login channel to use a starter app, makes sure you select Web app under App types.
Heroku account Heroku (opens new window)is a service that offers hosting for web apps. Deploying the starter app to Heroku means you don’t need your own server.
Heroku CLI The Heroku Command Line Interface (CLI) (opens new window)is necessary for using certain Heroku functions.

就着我对文档的理解,我小小提一嘴:实际使用的时候Channel是最小单位,openId是用户在Channel唯一标识,在不同Channel当中同一个用户的openId是不同的。

步骤一:创建Line Login Channel

Channel是应用程序与 LINE 平台连接的通道,第一步要做的就是在控制台为Web Apps创建Channel。

  1. 登录Line开发者控制台

  2. 选择一个Provider,并选择在Channels 选项中选择LINE Login

  3. 填入必填的信息,信息的解释如下:

    Item Required? Description Location displayed to users
    Channel type The channel type. Select LINE Login to create your LINE Login Channel. -
    Provider The channel’s provider Permission consent screen when launching LINE Login or LIFF App
    Region to provide the service The region you want to provide your LINE Login service. One of: JapanThailandTaiwanIndonesia*If you want to provide your service in multiple regions, create a channel for each region. -
    Company or owner’s country or region Country or region of the company or owner that manage the channel Permission consent screen when launching LINE Login or LIFF App
    Channel icon The channel’s icon Permission consent screen when launching LINE Login or LIFF App
    Channel name The channel’s name *Channel name can’t contain “LINE” or similar strings. Permission consent screen when launching LINE Login or LIFF App
    Channel description The channel’s description Permission consent screen when launching LINE Login or LIFF App
    App types The type of app you plan to integrate LINE Login with. One of: Web appMobile app*In the example of deploying a starter app, select Web app. -
    Email address Email address to receive important updates about the channel -
    Privacy policy URL See description The URL of the app’s privacy policy. Required if your provider is a certified provider. Permission consent screen when launching LINE Login or LIFF App
    Terms of use URL The URL of the app’s terms of use Permission consent screen when launching LINE Login or LIFF App
    LINE Developers Agreement Read and agree to the LINE Developers Agreement (opens new window). -
    LY Corporation Privacy Policy See description Required only if you’ve selected Thailand as Region to provide the service. Read and acknowledge LY Corporation Privacy Policy (opens new window). -

这一步的一些注意事项我截取原文放下来

image-20240301170843885

步骤二:部署starter应用

接下来通过配置在第一步创建Channel的时候生成的channel ID和channel secret,就可以部署demo程序了

  1. git克隆以下任一项目,第二个比较方便
  1. application.yml中填入第一步创建Channel的时候生成的channel ID和channel secret
  2. 修改com.linecorp.sample.login.infra.http.Client中的http代理端口(V2RayN的是10809)

关于Java程序设置代理,可以看看这篇文章:Java配置代理

步骤三:检查Channel设置,并填入回调地址

  1. 进入第一步创建的Channel
  2. 点击Basic setting选项,App types一行勾上Web app
  3. 点击LINE Login选项,填入回调地址(跟application.yml保持一致)

在demo程序中/authController就是回调用的,同时也要在application.yml中进行配置

控制台中Basic setting选项的信息解释如下

The Basic settings tab contains basic information about your channel. Here’s the information you’ll find:

Item Description
Channel ID Unique identifier for the channel
Region to provide the service The region you want to provide your LINE Login service. You can only set the region when creating a new channel.
Company or owner’s country or region Country or region of the company or owner that manage the channel
Channel icon The channel’s icon
Channel name The channel’s name
Channel description The channel’s description
Email address Email address to receive important updates about the channel
Privacy policy URL The URL of the app’s privacy policy
Terms of use URL The URL of the app’s terms of use
App types The type of app you plan to integrate LINE Login with
Permissions The type of user data this channel can access
Channel secret A unique secret key you can use to grant an app access to your channel
Assertion Signing Key The UUIDs associated with your assertion signing key pair
Your user ID Your LINE account’s user ID
Linked LINE Official Account Your LINE Official Account linked to this channel. You can only link a LINE Official Account from the same provider.
Localization You can add other languages to provide multi-language support for your channel.
Email address permission Apply for permission to request a user’s email using OpenID Connect.
Delete Delete this channel.

步骤四:尝试登录

  1. 浏览器进入应用根地址

LINE Login starter app login

  1. 点击按钮,通过提示完成Line登录

  2. 尝试对Token进行操作:

    1. Verify the user access token
    2. Refresh the user access token
    3. Revoke the access token (log out)
  3. 查看控制台拿到的用户信息

步骤五:进一步配置程序

关于程序的进一步配置,可以通过文档去了解不同模块的设置和效果,我就不展开了,比如设置不同的Scopes获取不同需要的信息,我把它截取出来

image-20240301181629746

OK,写完下班,快乐周末~