Facebook サインインを iOS (Swift) で構築する方法

新しい友達のために:

Logto は、モダンなアプリや SaaS 製品向けに設計された Auth0 の代替です。 Cloud とオープンソースの両方のサービスを提供し、アイデンティティと管理 (IAM) システムを迅速に立ち上げるのに役立ちます。認証 (Authentication)、認可 (Authorization)、マルチテナント管理をすべて一つにまとめて楽しんでください。

Logto Cloud で無料の開発テナントから始めることをお勧めします。これにより、すべての機能を簡単に探索できます。

この記事では、iOS (Swift) と Logto を使用して、Facebook サインイン体験（ユーザー認証 (Authentication)）を迅速に構築する手順を説明します。

前提条件

稼働中の Logto インスタンス。紹介ページをチェックして始めてください。
iOS (Swift) の基本的な知識。
使用可能な Facebook アカウント。

Logto でアプリケーションを作成する

Logto は OpenID Connect (OIDC) 認証 (Authentication) と OAuth 2.0 認可 (Authorization) に基づいています。これは、複数のアプリケーション間でのフェデレーテッドアイデンティティ管理をサポートし、一般的にシングルサインオン (SSO) と呼ばれます。

あなたの Native app アプリケーションを作成するには、次の手順に従ってください：

Logto コンソールを開きます。「Get started」セクションで、「View all」リンクをクリックしてアプリケーションフレームワークのリストを開きます。あるいは、Logto Console > Applications に移動し、「Create application」ボタンをクリックします。
開いたモーダルで、左側のクイックフィルターチェックボックスを使用して、利用可能なすべての "Native app" フレームワークをフィルタリングするか、"Native app" セクションをクリックします。"iOS (Swift)" フレームワークカードをクリックして、アプリケーションの作成を開始します。
アプリケーション名を入力します。例：「Bookstore」と入力し、「Create application」をクリックします。

🎉 タダーン！Logto で最初のアプリケーションを作成しました。詳細な統合ガイドを含むお祝いページが表示されます。ガイドに従って、アプリケーションでの体験を確認してください。

iOS (Swift) SDK を統合する

Logto SDK を依存関係として追加する

注記:

Logto Swift SDK のサポートされている最小 iOS バージョンは iOS 13 です。

Logto Swift SDK には 2 つの主要バージョンがあります：

v2：サインイン体験を ASWebAuthenticationSession（システムブラウザ）で開きます。これによりパスキーサインインが可能になり、ブラウザセッションが共有されます。v2 ではネイティブソーシャルプラグインターゲットが削除されていますが、ソーシャルコネクターは引き続きブラウザ経由で動作します。ネイティブの WeChat や Alipay SDK 連携が必要な場合は v1 をご利用ください。
v1：サインイン体験を埋め込み WebView で開きます。これはネイティブソーシャルプラグインターゲットに必要ですが、パスキーサインインには対応していません（WebView はパスキーの基盤となる WebAuthn をサポートしていません）。

このガイドは両バージョンに対応しています。下記のタブでバージョンを選択してください。選択はガイド全体で同期されます。

Swift Package Manager で Logto SDK を依存関係として追加するには、以下の URL を使用してください。

https://github.com/logto-io/swift.git

Xcode 11 以降、Swift パッケージを直接インポートできます。追加ツールは不要です。

Xcode でパッケージバージョンを尋ねられたら、統合したいバージョンを選択してください：

バージョンには最新の v2 リリースを使用してください。最新の v2 バージョンは 2.0.0 です。

Package.swift を直接使用する場合：

Package.swift
// Logto Swift SDK を依存関係として追加
.package(url: "https://github.com/logto-io/swift.git", from: "2.0.0")

ネイティブソーシャルプラグインターゲットが必要な場合は、最新の v1 リリースを使用してください。最新の v1 バージョンは 1.2.0 です。

Package.swift を直接使用する場合：

Package.swift
// Logto Swift SDK を依存関係として追加
.package(url: "https://github.com/logto-io/swift.git", from: "1.2.0")

Carthage および CocoaPods には、技術的な理由により現時点では対応していません。

Carthage

Carthage はビルドに xcodeproj ファイルが必要です。今後回避策を検討します。

CocoaPods

CocoaPods はローカル依存関係およびモノレポに対応していないため、このリポジトリ用の .podspec を作成するのは困難です。

LogtoClient を初期化する

LogtoConfig オブジェクトを使用して LogtoClient インスタンスを作成することで、クライアントを初期化します。

ContentView.swift
import Logto
import LogtoClient

let config = try? LogtoConfig(
  endpoint: "<your-logto-endpoint>", // 例: http://localhost:3001
  appId: "<your-app-id>"
)
let client = LogtoClient(useConfig: config)

備考:

デフォルトでは、ID トークンやリフレッシュトークンのような資格情報を Keychain に保存します。したがって、ユーザーは戻ってきたときに再度サインインする必要はありません。

この動作をオフにするには、usingPersistStorage を false に設定します：

let config = try? LogtoConfig(
  // ...
  usingPersistStorage: false
)

詳細に入る前に、エンドユーザー体験の概要を簡単にご紹介します。サインインプロセスは次のようにシンプルにまとめられます：

アプリがサインインメソッドを呼び出します。
ユーザーは Logto のサインインページにリダイレクトされます。ネイティブアプリの場合は、システムブラウザが開かれます。
ユーザーがサインインし、アプリ（リダイレクト URI として設定）に戻されます。

この認証 (Authentication) プロセスは OpenID Connect (OIDC) プロトコルに従い、Logto はユーザーのサインインを保護するために厳格なセキュリティ対策を講じています。
複数のアプリがある場合、同じアイデンティティプロバイダー (Logto) を使用できます。ユーザーがあるアプリにサインインすると、Logto は別のアプリにアクセスした際に自動的にサインインプロセスを完了します。

リダイレクトベースのサインインの理論と利点について詳しく知るには、Logto サインイン体験の説明を参照してください。

リダイレクト URI の設定

Logto コンソールのアプリケーション詳細ページに切り替えましょう。リダイレクト URI io.logto.app://callback を追加し、「変更を保存」をクリックします。

v2 では、サインイン体験は ASWebAuthenticationSession（システムブラウザ）で開かれ、リダイレクトは OS レベルのコールバックマッチングを通じてアプリに戻されます。io.logto.app://callback のようなカスタムスキームのリダイレクト URI を使う場合、アプリの Info.plist にはスキーム部分（io.logto.app）のみを登録し、Logto アプリケーションの Redirect URIs には完全なリダイレクト URI を追加してください。

Xcode でアプリのターゲットを開き、Info を選択し、URL Types を展開して、URL Schemes に io.logto.app を追加します。Info.plist を直接編集する場合は、以下を追加します：

Info.plist
<key>CFBundleURLTypes</key>
<array>
  <dict>
    <key>CFBundleTypeRole</key>
    <string>Editor</string>
    <key>CFBundleURLName</key>
    <string>io.logto.app</string>
    <key>CFBundleURLSchemes</key>
    <array>
      <string>io.logto.app</string>
    </array>
  </dict>
</array>

v2 のブラウザフローでは、LogtoClient.handle(url:) を呼び出す必要はありません。このプラグインハンドオフ API は埋め込み WebView フローとともに削除されました。

カスタムスキームの代わりに Universal Links を使う？

https://example.com/callback のような HTTPS リダイレクト URI も利用できます：

アプリに Associated Domains 機能を追加します。
webcredentials:example.com を設定し、iOS 17.4 以降で ASWebAuthenticationSession が HTTPS コールバックをマッチできるようにします。
同じ URL で認証セッション外でも Universal Link としてアプリを開きたい場合は、applinks:example.com を設定し、ドメインとパスに有効な apple-app-site-association ファイルをホストします。
Logto アプリケーションの Redirect URIs に HTTPS URI を追加します。
signInWithBrowser に同じ URI を渡します。

iOS 17.4 以降では、SDK は ASWebAuthenticationSession の HTTPS コールバックマッチング API を利用するため、HTTPS リダイレクトで自動的にセッションを完了・終了できます。古い iOS バージョンでは、認可リクエストで HTTPS リダイレクト URI を使えますが、Universal Link コールバックをアプリ側で処理しない限りセッションが自動で閉じない場合があります。古い iOS バージョンで自動完了が必要な場合は、互換性のためにカスタムスキームリダイレクトも残しておいてください。

Logto コンソールのアプリケーション詳細ページに切り替えましょう。リダイレクト URI io.logto://callback を追加し、「変更を保存」をクリックします。

備考:

iOS SDK の Redirect URI は内部利用のみです。コネクターから要求されるまで Custom URL Scheme を追加する 必要はありません。

注記:

.signInWithBrowser(redirectUri:) を呼び出す前に、Admin Console でリダイレクト URI が正しく設定されていることを確認してください。 :::

v2 では、client.signOut(postLogoutRedirectUri:) を使うと完全なサインアウトが実行されます：ローカル認証情報のクリア、リフレッシュトークン (Refresh token) の取り消し、システムブラウザでエンドセッションエンドポイントを開いて Logto セッションを終了します。その後、ブラウザはサインアウト後リダイレクト URI を通じてアプリに戻ります。利用前に Logto Console のアプリケーション詳細ページでサインアウト後リダイレクト URI io.logto.app://signed-out を追加し、「Save changes」をクリックしてください。サインアウト後リダイレクト URI にはサインイン時に登録したカスタムスキームを使えます。

SwiftUI アプリの例：

ContentView.swift
// コメントは翻訳済み
struct ContentView: View {
  @State var isAuthenticated: Bool

  private let redirectUri = "io.logto.app://callback"
  private let postLogoutRedirectUri = "io.logto.app://signed-out"

  init() {
    isAuthenticated = client.isAuthenticated
  }

  var body: some View {
    VStack {
      if isAuthenticated {
        Button("Sign Out") {
          Task { [self] in
            let error = await client.signOut(postLogoutRedirectUri: postLogoutRedirectUri)
            if let error = error {
              print(error)
              return
            }
            isAuthenticated = false
          }
        }
      } else {
        Button("Sign In") {
          Task { [self] in
            do {
              try await client.signInWithBrowser(redirectUri: redirectUri)
              isAuthenticated = true
            } catch let error as LogtoClientErrors.SignIn {
              // サインイン中にエラーが発生
            } catch {
              // その他のエラー
            }
          }
        }
      }
    }
  }
}

注記:

サインアウト後リダイレクト URI なしで client.signOut() を呼ぶこともできます。この場合 Console 側の設定は不要です：ブラウザに Logto サインアウトページが表示され、ユーザーは手動で閉じてアプリに戻ります。
UI コンテキストが利用できない場合は、client.clearCredentials() でローカル認証情報のクリアとリフレッシュトークン (Refresh token) の取り消しが可能です。ただし、この場合ブラウザ上の Logto セッションは残るため、次回の signInWithBrowser でそのセッションを使ってサイレントサインインされる場合があります。

client.signInWithBrowser(redirectUri:) でユーザーのサインイン、client.signOut() でサインアウトができます。

SwiftUI アプリの例：

ContentView.swift
// コメントは翻訳済み
struct ContentView: View {
  @State var isAuthenticated: Bool

  init() {
    isAuthenticated = client.isAuthenticated
  }

  var body: some View {
    VStack {
      if isAuthenticated {
        Button("Sign Out") {
          Task { [self] in
            await client.signOut()
            isAuthenticated = false
          }
        }
      } else {
        Button("Sign In") {
          Task { [self] in
            do {
              try await client.signInWithBrowser(redirectUri: "io.logto://callback")
              isAuthenticated = true
            } catch let error as LogtoClientErrors.SignIn {
              // サインイン中にエラーが発生
            } catch {
              // その他のエラー
            }
          }
        }
      }
    }
  }
}

チェックポイント: アプリケーションをテストする

これで、アプリケーションをテストできます：

アプリケーションを実行すると、サインインボタンが表示されます。
サインインボタンをクリックすると、SDK がサインインプロセスを初期化し、Logto のサインインページにリダイレクトされます。
サインインすると、アプリケーションに戻り、サインアウトボタンが表示されます。
サインアウトボタンをクリックして、トークンストレージをクリアし、サインアウトします。

Facebook コネクターを追加する

迅速なサインインを有効にし、ユーザーコンバージョンを向上させるために、アイデンティティプロバイダー (IdP) として iOS (Swift) を接続します。Logto ソーシャルコネクターは、いくつかのパラメーター入力を許可することで、この接続を数分で確立するのに役立ちます。

ソーシャルコネクターを追加するには、次の手順に従ってください：

Console > Connectors > Social Connectors に移動します。
「Add social connector」をクリックし、「Facebook」を選択します。
README ガイドに従い、必要なフィールドを完了し、設定をカスタマイズします。

注記:

インプレースコネクターガイドに従っている場合は、次のセクションをスキップできます。

Facebook login を設定する

ステップ 1: Facebook App Dashboard でアプリをセットアップする

Facebook を認証 (Authentication) プロバイダーとして利用する前に、Facebook デベロッパープラットフォームでアプリをセットアップし、OAuth 2.0 資格情報を取得する必要があります。

まだアカウントがない場合は、 Facebook デベロッパーとして登録してください。
アプリページにアクセスします。
既存のアプリをクリックするか、必要に応じて新しいアプリを作成します。

ヒント:

ユースケースは、アプリが Meta とどのようにやり取りするかの主要な方法であり、アプリで利用可能な API、機能、権限、プロダクトを決定します。ソーシャル認証 (Authentication) のみ（メールアドレスと public_profile の取得）が必要な場合は「Authentication and request data from users with Facebook Login」を選択してください。Facebook API へのアクセスが必要な場合は、希望するユースケースを選択してください。ほとんどのユースケースは、アプリ作成後に「Facebook Login for business」の統合もサポートしています。

アプリ作成後、アプリダッシュボードページで Use cases > Facebook Login > Settings または Facebook Login for business > Settings に移動します。
Valid OAuth Redirect URIs に Logto の Callback URI を入力します（Logto の Facebook コネクターからコピーしてください）。ユーザーが Facebook でサインインした後、ここに認可コード付きでリダイレクトされ、Logto が認証 (Authentication) を完了します。
Use cases に移動し、ユースケースの Customize をクリックしてスコープを追加します。Logto で Facebook サインインを実装するには email と public_profile の追加を推奨します（必須）。

ステップ 2: クライアント資格情報で Logto コネクターをセットアップする

Facebook App Dashboard で、サイドバーの App settings > Basic をクリックします。
パネルに App ID と App secret が表示されます。
App secret 入力欄の横にある Show ボタンをクリックして内容を表示し、コピーします。
Logto の Facebook コネクター設定を行います：
- clientId フィールドに App ID を入力します。
- clientSecret フィールドに App secret を入力します。
- Logto で Save and Done をクリックし、アイデンティティシステムと Facebook を接続します。

ステップ 3: スコープを設定する

スコープは、アプリがユーザーから要求する権限を定義し、Facebook アカウントからどのプライベートデータにアクセスできるかを制御します。

Facebook App Dashboard でスコープを設定する

Facebook App Dashboard > Use cases に移動し、Customize ボタンをクリックします。
アプリが必要とするスコープのみを追加します。ユーザーは Facebook の同意画面でこれらの権限を確認し、承認します：
- 認証 (Authentication) 用（必須）：email と public_profile
- API アクセス用（任意）：アプリが必要とする追加スコープ（例：Threads API へのアクセスには threads_content_publish、threads_read_replies など）。利用可能なサービスは Meta Developer Documentation を参照してください。

Logto でスコープを設定する

ニーズに応じて、以下のいずれかの方法を選択してください：

オプション 1: 追加の API スコープが不要な場合

Logto の Facebook コネクターの Scopes フィールドを空欄のままにします。
デフォルトのスコープ email public_profile がリクエストされ、Logto が基本的なユーザー情報を正しく取得できます。

オプション 2: サインイン時に追加スコープをリクエストする場合

必要なすべてのスコープを Scopes フィールドにスペース区切りで入力します。
ここに入力したスコープがデフォルトを上書きするため、必ず認証 (Authentication) 用スコープ email public_profile も含めてください。

オプション 3: 後からインクリメンタルスコープをリクエストする場合

ユーザーがサインインした後、フェデレーテッドソーシャル認可 (Authorization) フローを再実行し、ユーザーの保存済みトークンセットを更新することで、必要に応じて追加スコープをリクエストできます。
これらの追加スコープは Logto の Facebook コネクターの Scopes フィールドに入力する必要はなく、Logto の Social Verification API を通じて実現できます。

これらの手順に従うことで、Logto Facebook コネクターはアプリに必要な権限のみをリクエストします。

ヒント:

アプリが Facebook API へのアクセスやアクション実行のためにこれらのスコープをリクエストする場合は、Logto Facebook コネクターで Store tokens for persistent API access を有効にしてください。詳細は次のセクションを参照してください。

ステップ 4: 一般設定

Facebook への接続を妨げることはありませんが、エンドユーザーの認証 (Authentication) 体験に影響する可能性のある一般的な設定を紹介します。

プロフィール情報の同期

Facebook コネクターでは、ユーザー名やアバターなどのプロフィール情報の同期ポリシーを設定できます。以下から選択してください：

サインアップ時のみ同期：ユーザーが初めてサインインしたときにプロフィール情報を一度だけ取得します。
サインイン時に常に同期：ユーザーがサインインするたびにプロフィール情報を更新します。

Facebook API へのアクセス用トークンの保存（任意）

Facebook API へのアクセスやユーザー認可によるアクション実行（ソーシャルサインインまたはアカウント連携経由）を行いたい場合、Logto は特定の API スコープを取得し、トークンを保存する必要があります。

上記の手順に従って必要なスコープを追加します。
Logto Facebook コネクターで Store tokens for persistent API access を有効にします。Logto は Facebook アクセストークンを Secret Vault に安全に保存します。

注記:

Facebook はリフレッシュトークンを提供していません。ただし、トークン保存が有効な場合、Logto はユーザー認証 (Authentication) 時に自動的に長期間有効なアクセストークン（60日間）をリクエストします。この期間中、ユーザーは手動でアクセストークンを取り消すことができますが、そうでなければ Facebook API へのアクセスに再認可は不要です。注意：offline_access を Scope フィールドに追加しないでください。エラーの原因となる場合があります。

テスト、開発者、管理者ユーザーアカウントを使ってアプリでのサインインをテストできます。また、アプリを公開して任意の Facebook ユーザーがサインインできるようにすることも可能です。

Facebook App Dashboard で、サイドバーの App roles > Test Users をクリックします。
Create test users ボタンをクリックしてテストユーザーを作成します。
既存のテストユーザーの Options ボタンをクリックすると、「名前とパスワードの変更」などの操作が可能です。

通常、テスト、管理者、開発者ユーザーのみがアプリでサインインできます。プロダクション環境で一般の Facebook ユーザーがアプリでサインインできるようにするには、アプリを公開する必要があります。

Facebook App Dashboard で、サイドバーの Publish をクリックします。
必要に応じて Privacy Policy URL と User data deletion フィールドを入力します。
右下の Save changes ボタンをクリックします。
アプリ上部バーの Live スイッチボタンをクリックします。

設定を保存する

Logto コネクター設定エリアで必要な値をすべて記入したことを確認してください。「保存して完了」または「変更を保存」をクリックすると、Facebook コネクターが利用可能になります。

ソーシャルコネクターを正常に作成したら、サインイン体験で「Facebook で続行」ボタンとして有効にすることができます。

Console > サインイン体験 > サインアップとサインインに移動します。
（オプション）ソーシャルログインのみが必要な場合は、サインアップ識別子に「該当なし」を選択します。
設定済みの Facebook コネクターを「ソーシャルサインイン」セクションに追加します。

テストと検証

iOS (Swift) アプリに戻ります。これで Facebook を使用してサインインできるはずです。お楽しみください！

さらなる読み物

エンドユーザーフロー：Logto は、MFA やエンタープライズシングルサインオン (SSO) を含む即時使用可能な認証 (Authentication) フローを提供し、アカウント設定、セキュリティ検証、マルチテナント体験の柔軟な実装のための強力な API を備えています。

認可 (Authorization)：認可 (Authorization) は、ユーザーが認証 (Authentication) された後に行えるアクションやアクセスできるリソースを定義します。ネイティブおよびシングルページアプリケーションの API を保護し、ロールベースのアクセス制御 (RBAC) を実装する方法を探ります。

組織 (Organizations)：特にマルチテナント SaaS や B2B アプリで効果的な組織機能は、テナントの作成、メンバー管理、組織レベルの RBAC、およびジャストインタイムプロビジョニングを可能にします。

顧客 IAM シリーズ：顧客（または消費者）アイデンティティとアクセス管理に関する連続ブログ投稿で、101 から高度なトピックまでを網羅しています。

Logto でアプリケーションを作成する​

iOS (Swift) SDK を統合する​

Logto SDK を依存関係として追加する​

Carthage​

CocoaPods​

LogtoClient を初期化する​

サインイン​

リダイレクトベースのサインインについて​

リダイレクト URI の設定​

カスタムスキームの代わりに Universal Links を使う？​

サインインとサインアウト​

チェックポイント: アプリケーションをテストする​

Facebook コネクターを追加する​

Facebook login を設定する​

ステップ 1: Facebook App Dashboard でアプリをセットアップする​

ステップ 2: クライアント資格情報で Logto コネクターをセットアップする​

ステップ 3: スコープを設定する​

Facebook App Dashboard でスコープを設定する​

Logto でスコープを設定する​

ステップ 4: 一般設定​

プロフィール情報の同期​

Facebook API へのアクセス用トークンの保存（任意）​

ステップ 5: Facebook のテストユーザーでサインインをテストする（任意）​

ステップ 6: Facebook サインイン設定を公開する​

設定を保存する​

サインイン体験で Facebook コネクターを有効にする​

テストと検証​

さらなる読み物​