LINEログインを利用するには

ここでは、簡単なウェブアプリ用のスターターアプリをデプロイして、LINEログインを利用する方法を説明します。スターターアプリにアクセスすると、ユーザーのLINEアカウントでログインできます。また、ログイン時に発行されるアクセストークンを利用して、Social APIの機能を実行できます。

このページの操作をすべて行うと、LINEログインの仕組みや、LINEログインをウェブアプリに組み込む方法について、よく理解できます。

始める前に

LINEログインのスターターアプリを利用するには、以下の要件を満たす必要があります。

項目 説明
LINEアカウント LINEを利用するためのアカウントです。LINEアカウントを作成するには、LINEをダウンロードして、起動し、新規登録をタップします。
LINEログインのチャネル チャネルは、アプリとLINEプラットフォームを接続するための通信路です。アプリごとに、チャネルを作成する必要があります。LINEログインのチャネルは、コンソールで作成します。コンソールにログインするには、LINEアカウントが必要です。
注:
  • コンソールを利用したことがない場合は、開発者として登録してからチャネルを作成します。
  • チャネルは、プロバイダーの中に作成します。プロバイダーを作成していない場合は、プロバイダーを作成してからチャネルを作成します。
  • LINEログインのチャネルを作成する際は、[アプリタイプ]で、[WEBで使う [WEB]]を選択してください。
Herokuアカウント Herokuは、ウェブアプリを無料でホストできるサービスです。スターターアプリをHerokuにデプロイするため、Heroku以外のサーバーを用意する必要がありません。
Heroku CLI Herokuの機能を利用するには、Heroku Command Line Interface (CLI) が必要です。

Step 1: スターターアプリをデプロイする

要件を満たしていることを確認できましたか?次は、以下の操作を行ってください。

  1. GitHubのline-login-starterリポジトリにアクセスします。
  2. READMEファイル[Deploy to Heroku]ボタンをクリックします。
  3. Herokuの[Create New App]ページに必要な情報を入力します。
    • Heroku app name
      一意の名前を設定します。次のような名前を推奨します: line-login-starter-{YYYYMMDD}
    • Region
    • Config Vars
      • チャネルID(コンソールで確認できます)
      • チャネルシークレット(コンソールで確認できます)
      • 次の形式のコールバックURL:https://{Heroku app name}.herokuapp.com/auth
  4. [Deploy app]をクリックし、アプリが正常にデプロイされたことを確認します。

Step 2: LINEログインのチャネルを設定する

  1. コンソールにアクセスし、LINEログインのチャネルの詳細情報を表示します。
  2. [チャネル基本設定]タブをクリックし、[アプリタイプ]「WEB」が表示されていることを確認します。
  3. [アプリ設定]タブをクリックし、[Callback URL]にHerokuのコールバックURL(https://{Heroku app name}.herokuapp.com/auth)を入力します。

Step 3: ウェブアプリを試す

  1. ウェブアプリのURL(https://{Heroku app name}.herokuapp.com)にアクセスします。以下のように表示されます。

    LINEログインのスターターアプリのログイン画面

  2. [Log in]をクリックします。

    LINEログインの標準的なページにリダイレクトされます。リダイレクト先のURLは、https://access.line.me/oauth2/v2.1/で始まり、多くのクエリパラメータが含まれています。クエリパラメータについて詳しくは、「ウェブアプリにLINEログインを組み込む」を参照してください。

  3. LINEにログインし、ウェブアプリに必要な権限を与えることを同意します。

LINEアカウントでログインすると、LINEユーザーのプロフィール画像、表示名、およびステータスメッセージが表示されます。(iOSまたはAndroidを使用していて、すでにLINEアカウントでログイン済みの場合は、自動的にウェブアプリにログインされます。)

スターターアプリのその他の機能を試す

ウェブアプリにログインした後で以下のボタンをクリックすると、ウェブアプリのその他の機能を試すことができます。

  • アクセストークンを検証する
  • アクセストークンを更新する
  • アクセストークンを取り消す(ユーザーをログアウトさせる)

ログを確認する

Heroku CLIを使用して、ウェブアプリのログを確認します。

  1. コマンドラインからHerokuにログインします。

    $ heroku login
    
  2. ログを確認します。

    $ heroku logs --app {Heroku app name} --tail
    

Step 4: ウェブアプリをカスタマイズする

スターターアプリをローカルコンピューターにダウンロードして、テストしたり修正したりできます。修正後は、任意のウェブサーバーにアプリをデプロイできます。ここでは、Step 1でデプロイしたHerokuアプリに変更を加えて、再デプロイする方法について説明します。

以下のソフトウェアをインストール済みであることを確認します。 - JDK 1.8以降 - Maven™ 3.0以降 - Git™

  1. GitHubのline-login-starterリポジトリをクローンします。

    git clone https://github.com/line/line-login-starter.git
    
  2. cdコマンドを実行して、line-login-starterディレクトリに移動します。

  3. Heroku用リモートをローカルリポジトリに追加します。

    $ heroku git:remote -a {Heroku app name}
    
  4. 変更を加えてコミットします(任意)。

    $ git add .
    $ git commit -m "First commit"
    
  5. 変更をHerokuのmasterブランチにプッシュします。

    $ git push heroku master
    

Step 5: チャネルを公開する(任意)

LINEログインのチャネルは「非公開」のステータスで作成されます。チャネルが非公開の場合は、Adminまたはテスターの権限(詳しくは、「権限を管理する」を参照)を持つユーザーのみがLINEログインを利用できます。そのほかのユーザーもLINEログインを利用できるようにするには、ステータスを「公開」に変更してください。ステータスを「公開」にするには、LINE DevelopersコンソールでLINEログインのチャネルを表示し、右上の[非公開]をクリックします。

LINEログインのテストのために使用する場合は、ステータスを変更する必要はありません。アプリのLINEログインを一般のユーザーが利用できるようにするときに限り、ステータスを「公開」に変更してください。

次のステップ

{{ $t("form.question.helpful") }}

{{ $t("form.question.detail") }}

{{ $t("form.question.improve") }}

{{ $t("form.info.start") }}{{ $t("form.info.link") }}{{ $t("form.info.end") }}


{{ $t("form.result.success") }}
{{ $t("form.result.error") }}
{{ $t("form.result.errorLink") }}