WWDC Quick Look 💓 By SwiftGGTeam
Enhance your Sign in with Apple experience

Enhance your Sign in with Apple experience

元の動画を見る

ハイライト

Apple でサインインに関する主要な問題の 1 つはアカウントの重複です。ユーザーは最初に電子メール アドレスとパスワードを使用して登録し、後で Apple でサインインを使用して 2 番目のアカウントを作成する可能性があります。セッションの前半は、この問題点に対処することに専念します。

主要内容

アプリが電子メール パスワードと Apple でのサインインの両方をサポートすると、ログイン入り口がさらに増えます。古いユーザーはすでにパスワード アカウントを持っており、新しいユーザーは Apple をクリックして直接ログインできます。この時点でアプリが新しいアカウントを直接作成すると、同じ人が 2 つのアカウントを取得することになります。

このセッションの最初の目標は、このアカウントの重複を減らすことです。 Apple は、最初にパスワードの自動入力を実行し、次に認証サービスを使用して、アプリの起動時にデバイスにすでに存在する資格情報を表示することをお勧めします。ユーザーは、ログイン ページに入る前に、元のアカウントに戻ることを選択できます。

2 番目の目標は、アカウントのライフサイクルを完了することです。 Apple でのサインインが返されましたASAuthorizationAppleIDCredential安定したユーザー ID、名前、電子メール、信頼性インジケーター、ID トークン、および認証コードがあります。返されるタイミングも異なりますし、サーバー側の検証方法も異なります。アプリはログインボタンを接続して終了することはできません。

3 番目の目標は、同じ一連のエクスペリエンスを Web に拡張することです。 Web サイトには、サービス ID、ドメイン名、リダイレクト URL、および Apple JS でのサインインが必要です。認可が成功すると、ページは DOM イベントを通じて認可コード、ID トークン、およびユーザー情報を取得します。

詳細

起動時に既存の認証情報のみを表示する

04:03preferImmediatelyAvailableCredentialsこれは iOS 16 の新しいオプションであり、アプリ起動時の通話に適しています。これは、デバイス上ですぐに使用できる資格情報のみを表示し、新しい Apple アカウントでサインインを作成するようにユーザーに指示しないようにシステムに指示します。

import AuthenticationServices

let controller = ASAuthorizationController(authorizationRequests: [
    ASAuthorizationAppleIDProvider().createRequest(),
    ASAuthorizationPasswordProvider().createRequest()
])

controller.delegate = self
controller.presentationContextProvider = self

if #available(iOS 16.0, *) {
    controller.performRequests(options: .preferImmediatelyAvailableCredentials)
} else {
    controller.performRequests()
}

キーポイント:

  • ASAuthorizationAppleIDProvider().createRequest()既存の「Apple でサインイン」資格情報を照会します。 -ASAuthorizationPasswordProvider().createRequest()既存のパスワード資格情報を照会します。 -ASAuthorizationController両方のタイプのリクエストを同時に受信すると、システムは使用可能なログイン方法を選択インターフェイスに配置できるようになります。 -delegateユーザーが資格情報を選択した後に結果を受け取ります。 -presentationContextProvider認可インターフェースを表示するために必要なウィンドウコンテキストを提供します。 -preferImmediatelyAvailableCredentials起動フェーズ中に新しいアカウントを作成するプロセスがポップアップ表示されるのを避けてください。
  • 古いシステムを通常の状態に戻しますperformRequests()、互換性を維持します。

(05:14) ユーザーが資格情報を選択すると、デリゲートはさまざまな種類の資格情報を受け取ります。利用可能な認証情報がない場合、システムはエラー コールバックを呼び出し、アプリは標準のログイン インターフェイスを再度表示します。

func authorizationController(controller: ASAuthorizationController,
                             didCompleteWithAuthorization authorization: ASAuthorization) {
    switch authorization.credential {
    case let appleIDCredential as ASAuthorizationAppleIDCredential:
        // Sign the user in with Apple ID credential.
        // ...

    case let passwordCredential as ASPasswordCredential:
        // Sign the user in with password credential
        // ...
    }
}

func authorizationController(controller: ASAuthorizationController,
                             didCompleteWithError error: Error) {
    // No credential found. Fall back to login UI.
}

キーポイント:

  • didCompleteWithAuthorizationユーザーが既存の資格情報を選択した後の入り口です。 -ASAuthorizationAppleIDCredentialAppleアカウントでのサインインに対応。 -ASPasswordCredential対応するパスワード アカウント。古いユーザーを元のアカウントに戻すのに適しています。 -didCompleteWithError既存の認証情報がない場合にトリガーされ、通常のログインまたは登録フローにフォールバックするのに適しています。

Apple ID 認証情報を正しく読み取る

(06:24) Apple でサインインの認証が成功すると、アプリはASAuthorizationAppleIDCredential。 session は、いくつかのフィールドを明示的にリストします。userfullNameemailrealUserStatusidentityTokenauthorizationCode

// Conceptual sketch based on the fields discussed in the session.
let userID = appleIDCredential.user
let fullName = appleIDCredential.fullName
let email = appleIDCredential.email
let realUserStatus = appleIDCredential.realUserStatus
let identityToken = appleIDCredential.identityToken
let authorizationCode = appleIDCredential.authorizationCode

キーポイント:

  • user安定したユーザーIDです。同じ開発チームのアプリには同じ ID が割り当てられます。 -fullNameこれはビジネスで本当に必要な場合にのみ要求する必要があり、ユーザーは任意の名前を指定できます。 -emailApple ID の電子メール、または Hide My Email によって生成された転送電子メールである可能性があります。 -realUserStatusデバイス側の機械学習、アカウント履歴、ハードウェア構成証明の計算を使用して、不正防止を支援します。 -identityTokenJWTです。サーバーは、Apple 署名、発行者、対象者、有効期限、ノンスを検証する必要があります。 -authorizationCodeこれは、リフレッシュ トークンと引き換えに Apple ID サーバーに与えることができる短期の 1 回限りのトークンです。

08:37fullNameemailそしてrealUserStatus初めてアカウントを作成する場合にのみ返されます。以降のログインでは、これらの値は再度返されません。アプリで名前とメールアドレスが必要な場合は、アカウントの作成と確認の前に、名前とメールアドレスを安全にキャッシュする必要があります。

(09:35) サーバーが ID トークンを検証するとき、少なくとも 4 つのことを確認する必要があります。appleid.apple.com、オーディエンスはアプリのバンドル識別子であり、有効期限は現在時刻より大きく、ノンスは認可リクエストを作成する前に生成された値と一致しています。

認証情報のステータスとアカウントの削除を監視する

(12:00) 認証が完了すると、ユーザーセッションはアプリによって管理されます。ユーザーは、設定で Apple ID ログインを無効にするか、デバイスからログアウトすることができます。アプリの起動時に資格情報の状態を確認する必要があります。

let appleIDProvider = ASAuthorizationAppleIDProvider()
appleIDProvider.getCredentialState(forUserID: "currentUserIdentifier") { (credentialState, error) in
    switch credentialState {
    case .authorized:
        // Found valid Apple ID credential
    case .revoked:
        // Apple ID credential revoked. Log the user out.
    case .notFound:
        // No credential found. Show login UI.
    case .transferred:
        // Team is transferred
    }
}

キーポイント:

  • ASAuthorizationAppleIDProvider()これは、Apple ID 認証情報の状態を照会するための入り口です。 -getCredentialState(forUserID:)現在のユーザー ID で資格情報のステータスを確認します。 -.authorized資格情報がまだ有効であることを示します。 -.revoked資格情報が取り消されており、アプリが現在のユーザーをログアウトする必要があることを示します。 -.notFound資格情報が見つからなかったため、アプリがログイン インターフェイスを表示する必要があることを示します。 -.transferred開発チームの異動シナリオを処理します。

(12:18) アプリは、アクティブなクエリに加えて、資格情報の取り消し通知もリッスンする必要があります。

let notificationName = ASAuthorizationAppleIDProvider.credentialRevokedNotification

NotificationCenter.default.addObserver(self,
                                       selector: #selector(signOut(_:)),
                                       name: notificationName,
                                       object: nil)

キーポイント:

  • credentialRevokedNotificationApple ID 資格情報取り消しイベントです。 -NotificationCenter.default.addObserverイベントが到着したときにアプリが通知を受信できるようにします。 -selector: #selector(signOut(_:))元に戻すイベントをログアウト ロジックに接続します。
  • ステータスの変化が検出された場合、セッションは別のユーザーがログインしていると想定し、現在のユーザーをログアウトすることを推奨します。

(12:32) サーバー側アプリもサーバー間通知をサブスクライブする必要があります。 Apple は、イベントを Apple によって署名された JWT として同じエンドポイントに送信します。イベントには以下が含まれますemail-disabledconsent-revokedaccount-delete

(14:22) アカウント削除プロセスでは、新しい REST エンドポイントを呼び出すことができます。サーバーは、呼び出しの前に、まず有効なリフレッシュ トークンまたはアクセス トークンを準備します。auth/revoke。リフレッシュトークンを使用する場合、token_type_hint対応するREFRESH_TOKEN; アクセストークンが使用される場合、対応するACCESS_TOKEN。成功すると、トークンとユーザーのアクティブなセッションは直ちに無効になります。

Web 上で Apple にサインインする

(16:35) Web サイトにアクセスする前に、Apple Developer Portal でサービス ID を作成し、プライマリ アプリ ID、Web サイトのドメイン名、およびリダイレクト URL を構成する必要があります。ユーザーが情報共有に一度だけ同意すれば済むように、関連するアプリをグループ化することをお勧めします。

(17:55) Apple JS でのサインインは、ボタンの読み込みと承認リクエストの作成を担当します。ページで Apple の JS ファイルが紹介されたら、divボタンを宣言してから呼び出しますAppleID.auth.init

<html>
    <body>
        <script type="text/javascript" src="https://appleid.cdn-apple.com/appleauth/static/jsapi/appleid/1/en_US/appleid.auth.js"></script>
        <div id="appleid-signin" data-color="white" data-border="true" data-type="sign in"/>
        <script type="text/javascript">
            AppleID.auth.init({
                clientId : '[CLIENT_ID]',
                scope : '[SCOPES]',
                redirectURI : '[REDIRECT_URI]',
                state : '[STATE]',
                nonce : '[NONCE]',
                usePopup : true
            });
        </script>
    </body>
</html>

キーポイント:

  • appleid.auth.jsApple JSでサインインするためのエントリスクリプトです。 -id="appleid-signin"div「Apple でサインイン」ボタンが生成されます。 -data-colordata-borderdata-typeボタンの外観とテキストを制御します。 -clientId開発者ポータルで作成されたサービス ID です。 -scopeWeb サイトで実際に必要な名前または電子メール範囲のみを入力してください。 -redirectURI開発者ポータルの登録済み URL である必要があります。 -stateそしてnonce認可リクエストを保護するために使用されます。 -usePopupログイン インターフェイスでポップアップ ウィンドウを使用するか、現在のウィンドウにジャンプするかを制御します。

(18:28) ボタンはプロパティから調整できます。セッションでは、白、黒、Continue with Apple、ロゴのみの 4 つの書き込み方法が示されています。

<div id="appleid-signin" data-color="white" data-border="true" data-type="sign in"/>
<div id="appleid-signin" data-color="black" data-border="true" data-type="sign in"/>
<div id="appleid-signin" data-color="black" data-border="true" data-type="continue"/>
<div id="appleid-signin" data-color="black" data-border="true" data-mode="logo-only"/>

キーポイント:

  • data-color="white"白いボタンを生成します。 -data-color="black"黒いボタンを生成します。 -data-type="continue"ボタンのテキストを「Apple で続行」に変更します。 -data-mode="logo-only"Apple ロゴのみが表示されます。

(21:11) 認証結果は DOM イベントを通じて返されます。成功イベントには、認証コード、ID トークン、および要求されたユーザー情報が含まれます。

document.addEventListener('AppleIDSignInOnSuccess', (event) => {
    // Handle successful response.
    console.log(event.detail.data);
});

document.addEventListener('AppleIDSignInOnFailure', (event) => {
     // Handle error.
     console.log(event.detail.error);
});

キーポイント:

  • AppleIDSignInOnSuccess認証が成功した後にトリガーされます。 -event.detail.data成功の応答データが含まれます。 -AppleIDSignInOnFailure認証が失敗した後に発生します。 -event.detail.errorページが UI を復元するか、エラーを表示する必要がある場合の障害情報が含まれます。

重要ポイント

  • 起動時にログインするアカウント セレクターを作成します: アプリの起動時に呼び出されますperformRequests(options: .preferImmediatelyAvailableCredentials)、Apple ID とパスワードの両方の認証情報を要求します。ユーザーが古いパスワードを持つアカウントを選択すると、元のアカウントを直接入力して重複アカウントを減らすことができます。

  • パスワード アカウント アップグレード ポータルを作成します: 設定ページまたはログイン後に、パスワード アカウントを「Apple でサインイン」にアップグレードするようユーザーに求めます。実装の入口はアカウント認証変更拡張機能であり、ユーザーがパスワードを 1 つ少なく覚えられるようにするのに適しています。

  • 資格情報ステータス ガードを作成します: アプリの起動時に呼び出されますgetCredentialState(forUserID:)、実行時に監視credentialRevokedNotification。ステータスが revoked または notFound に変わったら、ローカル セッションをクリーンアップしてログイン ページに戻ります。

  • サーバー アカウントの削除プロセスを作成します: アカウントを削除するとき、サーバーはリフレッシュ トークンまたはアクセス トークンを使用して呼び出します。auth/revoke。成功したら、独自のデータベースの削除または匿名化プロセスを実行して、Apple ID の関連付けも同時に無効化します。

  • 統合ログイン ページの Web サイト バージョンを作成します: 開発者ポータルでサービス ID、ドメイン名、リダイレクト URL を構成し、Apple JS でサインインを使用してボタンをレンダリングし、監視しますAppleIDSignInOnSuccess次に、トークンと引き換えに認証コードをサーバーに渡します。

関連セッション

コメント

GitHub Issues · utterances