概要

この記事では LINE Loing を ASP.NET MVC に組み込む方法を解説します。

※課題

LINE Login の場合、初期状態では Email を取得できません。別途「メール取得権限の申請」を行う必要があります。
今回のライブラリでは Email が取得できない場合、MID に @line.com を付けて返すようにしています。

参考: LINE Loginを利用したWebアプリを ASP.NET Core + OpenID Connectで実装する（その２：メールアドレスを取得する）

必要なスキルとリソース

• C# と ASP.NET MVC の基本的な知識
• Visual Studio 2017
• LINE 開発者ポータルへのアクセス

LINE Login

サポートされる認証とフロー

ウェブアプリにLINEログインを組み込む にあるように、LINE Login は Web 業界標準である OAuth 2.0 と OpenID Connect をサポートしています。よってその他多くのソーシャルログインと同じ感覚で使えます。

[ログインフロー]

チャネルの作成

LINE Login を使うためには、まずチャネルを作成する必要があります。チャネルを設定する を参照してチャネルを作成してください。作成したチャネルの ChannelId と ChannelSecret は後ほど使います。

ASP.NET MVC アプリケーションの開発

1. Visual Studio を開き、「ASP.NET Web アプリケーション (.NET Framework)」を選択し、作成。

2. 「認証の変更」をクリック。

3. 「個別のユーザーアカウント」を選択して「OK」をクリック。

4. ソリューションの準備が完了した時点で、NuGet の管理より「Owin.Security.Middleware.Line」を追加。

5. Web.Config に以下の項目を追加。ChannelId と ChannelSecret は作成した LINE Login チャネルより取得。

    <add key="RedirectUri" value="http://localhost:62686/line-signin" />
    <add key="ChannelSecret" value="" />
    <add key="ChannelId" value="" />

6. App_Start\Startup.Auth.cs に using を追加。

using Owin.Security.Middleware.Line;
using Line.Login.Models;
using System.Configuration;

7. ConfigureAuth メソッド内に、以下コードを追加。

app.UseLineAuthentication(new LineAuthenticationOptions(
    channelId: ConfigurationManager.AppSettings["ChannelId"],
    channelSecret: ConfigurationManager.AppSettings["ChannelSecret"],
    redirectUri: ConfigurationManager.AppSettings["RedirectUri"],
    scope: Scope.OpenId | Scope.Profile
));

8. LINE 開発者コンソール より、作成した LINE Login チャネルの Callback URL を登録。

　テスト

1. F5 キーを押下してデバッグ実行。

2. 画面右上に「ログイン」をクリック。

3.「Line」をクリック。

4. LINE でログインを実行。

5. 初めての場合はユーザーを登録。必要に応じてメールアドレスを変更。

参照

LINE Loginを利用したWebアプリを ASP.NET Core + OpenID Connectで実装する（その２：メールアドレスを取得する）
GitHub: line-login-sdk-csharp