iOSアプリにLINEログインを組み込む

このページでは、LINEログインの実装方法として、既存のiOSアプリにLINE SDK for iOSを組み込む方法について説明します。LINEログインの機能を簡単に確認するには、iOS向けのLINEログインスターターアプリケーションを利用できます。「iOSアプリでLINEログインを試してみる」を参照してください。

始める前に

以下の作業が完了していることを確認します。

チャネルを設定する

アプリをチャネルとリンクするには、コンソールの[アプリ設定]ページで以下の項目を入力します。

  • iOSバンドルID:アプリのバンドル識別子。Xcodeのプロジェクト設定の[General]タブにあります。小文字を使用する必要があります。例えば、com.example.appです。複数のバンドル識別子を指定するには、改行で区切ります。
  • iOSスキーム:line3rdp.をバンドルIDの前に付加した文字列。例えば、バンドル識別子がcom.example.appの場合、iOSスキームはline3rdp.com.example.appに設定します。iOSスキームは1つのみ指定できます。

iOSアプリ設定

SDKをダウンロードする

LINE SDK for iOSは、CocoaPodsを使って、または「ダウンロード」ページからダウンロードできます。

CocoaPodsでダウンロードする

SDKをダウンロードするには、Podfileに以下の行を追加します。注:Swiftの場合は、Podfileに必ずuse_frameworks!を指定します。

pod 'LineSDK', '~> 4.1.0'

SDKをインストールしたら、「キーチェーンの共有を有効にする」の説明に従ってSDKを設定します。

「ダウンロード」ページからダウンロードする

ダウンロード」ページからSDKをダウンロードします。注:最新バージョンのSDKを使用してください。以前のバージョンのSDKは非推奨です。

SDKをインストールする

プロジェクトに必要なフレームワークをリンクする

Xcodeプロジェクトの[Build Phases]セクションの[Link Binary With Libraries]で、以下のフレームワークを追加します。この作業は「ダウンロード」ページからSDKをダウンロードした場合にのみ必要です。

  • LineSDK.framework
  • CoreTelephony.framework
  • Security.framework

必要なビルド設定を追加する

[Build Settings]>[Other Linker Flags]を選択して-ObjCを追加します。この作業は「ダウンロード」ページからSDKをダウンロードした場合にのみ必要です。

キーチェーンの共有を有効にする

LINE SDK for iOSは、キーチェーンを使ってユーザーの認証資格情報を保存します。したがって、SDKを利用するにはアプリでキーチェーンの共有を有効にする必要があります。

  1. Xcodeのプロジェクト設定の[Capabilities]>[Keychain Sharing]を選択して、キーチェーンの共有を有効にします。
  2. キーチェーン共有のエンタイトルメントをエンタイトルメントファイルに追加します。
  3. キーチェーン共有機能をApp IDに追加します。

注:App IDは、Appleの開発者アカウントで確認できます。

info.plistを設定する

アプリのInfo.plistに、チャネルIDを以下のとおりに設定します。「1234567890」をご自分のチャネルのチャネルIDに変更してください。注:チャネルIDは、コンソールの基本情報のセクションで確認できます。

<key>LineSDKConfig</key>
<dict>
    <key>ChannelID</key>
    <string>1234567890</string>
</dict>  

アプリ連携ログインに必要な設定をInfo.plistに追加します。これにより、ユーザーが既にLINEアプリにログインしている場合は、あなたのアプリに自動的にログインします。

<key>CFBundleURLTypes</key>
<array>
    <dict>
        <key>CFBundleTypeRole</key>
        <string>Editor</string>
        <key>CFBundleURLSchemes</key>
        <array>
            <string>line3rdp.$(PRODUCT_BUNDLE_IDENTIFIER)</string>
        </array>
    </dict>
</array>
<key>LSApplicationQueriesSchemes</key>
<array>
    <string>lineauth</string>
    <string>line3rdp.$(PRODUCT_BUNDLE_IDENTIFIER)</string>
</array>

アプリ連携ログインをAppDelegate.mで処理する

LINEアプリから返される認証処理の結果を処理するには、以下のコードをAppDelegate.mに追加します。

- (BOOL)application:(UIApplication *)app openURL:(NSURL *)url options:(NSDictionary *)options
{
    return [[LineSDKLogin sharedInstance] handleOpenURL:url];
}

LineSDKヘッダーファイルをインポートする

LINE SDKが使用されるすべてのファイルにLineSDK.hをインポートします。

#import <LineSDK/LineSDK.h>

LINEログインのデリゲートを設定してログイン結果を処理する

ログイン処理の結果を待機して処理するために、ログイン結果を受け取るview controllerにデリゲートを設定します。ユーザーがログインした後に結果を受け取ると、ユーザーのアクセストークン、ユーザーID 、およびユーザープロフィール情報を、NSStringsとして抽出できます。ユーザープロフィールには、ユーザーの表示名、ステータスメッセージ、およびプロフィール画像のURLが含まれます。

  1. View controllerのviewDidLoadメソッドでデリゲートを設定します。
    - (void)viewDidLoad {
        [super viewDidLoad];
    
    
        ...
    
        // Set the LINE Login Delegate
        [LineSDKLogin sharedInstance].delegate = self;
    }
    
  2. ログイン結果を処理してデータを保存するには、LineSDKLoginDelegatedidLoginメソッドを使用します。
    #pragma mark LineSDKLoginDelegate
    
    - (void)didLogin:(LineSDKLogin *)login
          credential:(LineSDKCredential *)credential
             profile:(LineSDKProfile *)profile
               error:(NSError *)error
    {
        if (error) {
            // Login failed with an error. Use the error parameter to identify the problem.
            NSLog(@"Error: %@", error.localizedDescription);
        }
        else {
    
            // Login success. Extracts the access token, user profile ID, display name, status message, and profile picture.
            NSString * accessToken = credential.accessToken.accessToken;
            NSString * userID = profile.userID;
            NSString * displayName = profile.displayName;
            NSString * statusMessage = profile.statusMessage;
            NSURL * pictureURL = profile.pictureURL;
    
            NSString * pictureUrlString;
    
            // If the user does not have a profile picture set, pictureURL will be nil
            if (pictureURL) {
                pictureUrlString = profile.pictureURL.absoluteString;
            }
    
        }
    }
    

didLoginメソッドのパラメータから、以下の情報を取得できます。

パラメータ 説明
credential ユーザーのアクセストークン
profile ユーザーのプロフィール情報
error ログインエラー情報。ログインが成功すると、nilになります。

LINEログインボタンを追加する

ユーザーがiOSアプリにログインできるようにするために、LINEロゴがついたログインボタンを作成できます。このボタンを使って、ユーザーは認証および認可を受けることができます。

注:LINEログインボタンをアプリに追加する前に、Usage Guidelines for the LINE Login Buttonに対して同意する必要があります。詳しくは、「LINEログインボタンデザインガイドライン」を参照してください。

画像をダウンロードしてプロジェクトに追加する

LINEログインボタンの画像セットには、iOS、Android、デスクトップアプリ用の画像が含まれます。また、さまざまな解像度やボタンの状態に対応する、複数の画像が用意されています。ここでは、iOSフォルダー内の「通常時」および「押下時」のログインボタン画像を使用した例を紹介します。

  1. LINEログインのボタン画像をダウンロードし、抽出します。
  2. btn_login_pressbtn_login_baseAssets.xcassetsに追加して、画像セットを作成します。

注:iOSフォルダーにある画像セットを使用します。使用したい解像度に応じて、32dpまたは44dpフォルダーの画像を使用できます。

画像を使用する

画像を使用する前に、ログインボタンのテキストを追加する必要があります。各言語で推奨されるテキストについては、「LINEログインボタンデザインガイドライン」を参照してください。また、LINEアイコンを歪みなく引き伸ばせるようにするために、テキストを伴う部分を固定する必要があります。

  1. LINEアイコンを歪みなく引き延ばせるようにするため、[Editor]>[Show Slicing]を選択します。
  2. [Start Slicing]をクリックします。修正する各画像に対して横方向に拡大縮小するアイコンを選択して、固定部分を設定します。
  3. アプリのログイン画面にボタンを追加し、任意の言語のログインテキストを設定します。

ボタンにアクションを追加する

ユーザーがログインボタンをクリックすると、アプリ連携ログインを使ってユーザーが認証されます。このログイン方法では、ユーザーがデバイスにLINEアプリをインストール済みの場合、LINEアプリからあなたのアプリにユーザーのLINE資格情報が渡されます。ユーザーはこの資格情報を使って認証を受けます。ユーザーがデバイスにLINEアプリをインストールしていない場合、ブラウザでLINEログインダイアログが開きます。ユーザーは、このダイアログにLINE資格情報を入力します。

View controllerに、startLoginメソッドを呼び出すボタンタップアクションを追加します。共通インスタンスのLineSDKLogin sharedInstanceがコールバック関数により取得され、結果がLineSDKLoginDelegateで処理されます。

- (IBAction)a2alogin:(id)sender {
    NSLog(@"Button pressed: %@");
    [[LineSDKLogin sharedInstance] startLogin];
}

LineSDKAPIオブジェクトを初期化する

LineSDKAPIオブジェクトのインスタンスを通じて、APIが呼び出されます。APIを呼び出すには、 LineSDKAPIオブジェクトを初期化する必要があります。

apiClient = [[LineSDKAPI alloc] initWithConfiguration:[LineSDKConfiguration defaultConfig]];

次のステップ

これで、あなたのiOSアプリにLINEログインの機能が追加されました。ユーザーは自分のLINEアカウントを使ってアプリにログインでき、アプリ側ではアクセストークンとユーザープロフィール情報を取得できます。LINEログインのその他の機能については、以下の記事を参照してください。