# LINEログインを始めよう
ここでは、簡単なウェブアプリ用のスターターアプリをデプロイして、LINEログインを利用する方法を説明します。スターターアプリにアクセスすると、ユーザーのLINEアカウントでログインできます。また、ログイン時に発行されるアクセストークンを利用して、ユーザープロフィールを取得することもできます。
このページの操作をすべて行うと、LINEログインの仕組みや、LINEログインをウェブアプリに組み込む方法について、よく理解できます。
プラットフォームごとにLINEログインのスターターアプリを試すことができます:
# 始める前に
LINEログインのスターターアプリを利用するには、以下の要件を満たす必要があります。
項目 | 説明 |
---|---|
LINEアカウント | LINEを利用するためのアカウントです。LINEアカウントは、LINE Developersコンソールにログインするために必要です。LINEアカウントを作成するには、LINEをダウンロードして (opens new window)、起動し、新規登録をタップします。 |
プロバイダー | プロバイダーは、アプリを提供する個人または組織を表す概念です。プロバイダーは、LINE Developersコンソールで作成します。1人のLINEユーザーは、プロバイダーごとに異なるユーザーIDを持ちます。 |
LINEログインのチャネル | チャネルは、アプリとLINEプラットフォームを接続するための通信路です。プロバイダーの中に作成します。アプリごとに、チャネルを作成する必要があります。LINEログインのチャネルは、LINE Developersコンソールで作成します。 注:
|
Herokuアカウント | Heroku (opens new window)は、ウェブアプリをホストできるサービスです。スターターアプリをHerokuにデプロイするため、Heroku以外のサーバーを用意する必要がありません。 |
Heroku CLI | Herokuの機能を利用するには、Heroku Command Line Interface (CLI) (opens new window) が必要です。 |
Herokuの無料プランは、2022年11月27日をもって廃止されました。このスターターアプリを無料で試したい場合は、他のプラットフォームを利用してください。詳しくは、「Heroku’s Next Chapter (opens new window)」を参照してください。
# Step 1: LINEログインのチャネルを作成する
まずは、LINEログインのチャネルを作成します。
チャネルは、アプリとLINEプラットフォームを接続するための通信路です。ウェブアプリごとに、LINE DevelopersコンソールでLINEログインのチャネルを作成します。
- LINE Developersコンソールにアクセスします。
- プロバイダーを選択し、[チャネル設定]タブから[LINEログイン]を選択します。
- チャネルに必要な情報を入力します。以下の項目に情報を入力してLINEログインのチャネルを作成します。
項目 | 入力必須項目 | 説明 | ユーザーに表示される画面 |
---|---|---|---|
チャネルの種類 | ✅ | チャネルの種類。LINEログインを選択して、LINEログインチャネルを作成します。 | - |
プロバイダー | ✅ | チャネルのプロバイダー。 | LINEログインおよびLIFFアプリ起動時の権限の同意画面 |
サービスを提供する地域 | ✅ | LINEログインを組み込んだサービスを提供する地域。以下のいずれかを選択します。
| - |
会社・事業者の所在国・地域 | ✅ | チャネルを管理する会社・事業者の所在国・地域。 | LINEログインおよびLIFFアプリ起動時の権限の同意画面 |
チャネルアイコン | ❌ | チャネルのアイコン。 | LINEログインおよびLIFFアプリ起動時の権限の同意画面 |
チャネル名 | ✅ | チャネルの名前。 ※チャネル名には、「LINE」またはそれに類する文字列を含めることはできません。 | LINEログインおよびLIFFアプリ起動時の権限の同意画面 |
チャネル説明 | ✅ | チャネルの説明。 | LINEログインおよびLIFFアプリ起動時の権限の同意画面 |
アプリタイプ | ✅ | LINEログインを組み込むアプリの種類。以下のいずれかを選択します。
| - |
メールアドレス | ✅ | チャネルに関する重要な更新情報を受信するメールアドレス。 | - |
プライバシーポリシーURL | ❌ | アプリのプライバシーポリシーのURL。 | LINEログインおよびLIFFアプリ起動時の権限の同意画面 |
サービス利用規約URL | ❌ | アプリの利用規約のURL。 | LINEログインおよびLIFFアプリ起動時の権限の同意画面 |
LINE開発者契約 | ✅ | LINE開発者契約 (opens new window)を読んで同意します。 | - |
LINEプライバシーポリシー | 説明を参照 | [サービスを提供する地域]でタイを選択した場合のみ必須です。タイのLINEプライバシーポリシー (opens new window)を読んで承認します。 | - |
# Step 2: スターターアプリをデプロイする
次に、Herokuにスターターアプリをデプロイします。Step 1で作成したチャネルのチャネルIDとチャネルシークレットを利用します。以下の操作を行ってください。
- GitHubのline-login-starter (opens new window)リポジトリにアクセスします。
- READMEファイル (opens new window)の[Deploy to Heroku]ボタンをクリックします。
- Herokuの[Create New App]ページに必要な情報を入力します。
- Heroku app name
一意の名前を設定します。次のような名前を推奨します:line-login-starter-{YYYYMMDD}
- Region
- Config Vars
- 次の形式のコールバックURL:
https://{Heroku app name}.herokuapp.com/auth
- チャネルID(LINE Developersコンソールで確認できます)
- チャネルシークレット(LINE Developersコンソールで確認できます)
- 次の形式のコールバックURL:
- Heroku app name
- [Deploy app]をクリックし、アプリが正常にデプロイされたことを確認します。
# Step 3: チャネルの設定確認し、コールバックURLを入力する
ウェブアプリ用のLINEログインのチャネルを使用する場合は、[アプリタイプ]と[コールバックURL]が正しく設定されている必要があります。
- LINE Developersコンソールで、Step 1で作成したチャネルを選択します。
- [チャネル基本設定]タブをクリックし、[アプリタイプ]に[ウェブアプリ]が表示されていることを確認します。
- [LINEログイン設定]タブをクリックし、[コールバックURL]にHerokuのコールバックURL(
https://{Heroku app name}.herokuapp.com/auth
)を入力します。
# LINEログインのチャネル基本設定
LINEログインチャネルの[チャネル基本設定]タブで表示される情報は以下のとおりです。
項目 | 説明 |
---|---|
チャネルID | チャネルを区別するための識別子 |
サービスを提供する地域 | LINEログインサービスを提供する地域(チャネル作成時のみ設定可能) |
会社・事業者の所在国・地域 | チャネルを管理する会社・事業者の所在国・地域 |
チャネルアイコン | チャネルのアイコン |
チャネル名 | チャネルの名称 |
チャネル説明 | チャネルの詳細説明 |
メールアドレス | チャネルに関する重要なお知らせを受信するメールアドレス |
プライバシーポリシーURL | アプリのプライバシーポリシーのURL |
サービス利用規約URL | アプリの利用規約のURL |
アプリタイプ | LINEログインを組み込むアプリの種類 |
権限 | このチャネルがアクセスできるユーザー情報の種類 |
チャネルシークレット | アプリに対して、チャネルへのアクセスを許可したことを示す秘密鍵 |
アサーション署名キー | アサーション署名キーペアに紐づいたUUID |
あなたのユーザーID | LINEアカウントのユーザーID |
リンクされたボット | チャネルにリンクされたボット。同じプロバイダーに存在するチャネルと関連付けられたボットのみをリンクできます。(チャネル作成時のみ設定可能) |
多言語対応 | 言語を追加することで、チャネルを多言語対応にすることができます。 |
メールアドレス取得権限 | OpenID Connectを使用して、ユーザーのメールアドレスを要求できます。 |
チャネルの削除 | チャネルの削除 |
# Step 4: ウェブアプリを試す
ウェブアプリのURL(
https://{Heroku app name}.herokuapp.com
)にアクセスします。以下のように表示されます。[Log in]をクリックします。
LINEログインの標準的なページにリダイレクトされます。リダイレクト先のURLは、
https://access.line.me/oauth2/v2.1/
で始まり、多くのクエリパラメータが含まれています。クエリパラメータについて詳しくは、「ウェブアプリにLINEログインを組み込む」を参照してください。LINEにログインし、ウェブアプリに必要な権限を与えることを同意します。
LINEアカウントでログインすると、LINEユーザーのプロフィール画像、表示名、およびステータスメッセージが表示されます。(iOSまたはAndroidを使用していて、すでにLINEアカウントでログイン済みの場合は、自動的にウェブアプリにログインされます。)
# スターターアプリのその他の機能を試す
ウェブアプリにログインした後で以下のボタンをクリックすると、ウェブアプリのその他の機能を試すことができます。
- ユーザーのアクセストークンを検証する
- ユーザーのアクセストークンを更新する
- アクセストークンを取り消す(ユーザーをログアウトさせる)
# ログを確認する
Heroku CLI (opens new window)を使用して、ウェブアプリのログを確認します。
コマンドラインからHerokuにログインします。
$ heroku login
ログを確認します。
$ heroku logs --app {Heroku app name} --tail
# Step 5: ウェブアプリをカスタマイズする
スターターアプリをローカルコンピューターにダウンロードして、テストしたり修正したりできます。修正後は、任意のウェブサーバーにアプリをデプロイできます。ここでは、Step 1でデプロイしたHerokuアプリに変更を加えて、再デプロイする方法について説明します。
以下のソフトウェアをインストール済みであることを確認します。
- JDK 1.8以降
- Maven™ 3.0以降
- Git™
GitHubのline-login-starter (opens new window)リポジトリをクローンします。
git clone https://github.com/line/line-login-starter.git
cd
コマンドを実行して、line-login-starter
ディレクトリに移動します。Heroku用リモートをローカルリポジトリに追加します。
$ heroku git:remote -a {Heroku app name}
変更を加えてコミットします(任意)。
$ git add . $ git commit -m "First commit"
変更をHerokuのmasterブランチにプッシュします。
$ git push heroku master
# Step 6: チャネルを公開する(任意)
LINEログインのチャネルは「開発中」のステータスで作成されます。チャネルが「開発中」の場合は、AdminまたはTesterの権限(詳しくは、「権限を管理する」を参照)を持つユーザーのみがLINEログインを利用できます。そのほかのユーザーもLINEログインを利用できるようにするには、ステータスを「公開済み」に変更してください。ステータスを「公開済み」にするには、LINE DevelopersコンソールでLINEログインのチャネルを表示し、ページ上部の[開発中]をクリックします。
LINEログインのテストのために使用する場合は、ステータスを変更する必要はありません。アプリのLINEログインを一般のユーザーが利用できるようにするときに限り、ステータスを「公開済み」に変更してください。