Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Firebase Hostingを使ってPasskeyをandroidアプリで試してみよう

RyuNen344
December 08, 2023

Firebase Hostingを使ってPasskeyをandroidアプリで試してみよう

RyuNen344

December 08, 2023
Tweet

More Decks by RyuNen344

Other Decks in Programming

Transcript

  1. Firebase Hostingを使ってPasskeyを
    androidアプリで試してみよう
    Bunjiro Miyoshi(RyuNen344)
    GDG DevFest Tokyo 2023

    View full-size slide

  2. About Me
    ● RyuNen344
    ● Kotlin Multiplatform(KMM/KMP)好き
    ● 特技はKotlin/NativeでObj-Cを書くこと
    ● Gradleは友達, コワクナイ

    View full-size slide

  3. Agendas
    1. What is Passkey
    2. Minimum requirements for practicing Passkey
    3. Setup Firebase Hosting
    4. Practice androidx.CredentialManager

    View full-size slide

  4. What is Passkey
    ● FIDO2を使って同一エコシステム上であればキーが同期される規格
    ● FIDO
    ○ 専用デバイスの公開鍵と署名をやりとりすることで認証する
    ● FIDO2
    ○ 認証器がより柔軟になった(端末認証, 生体認証が利用可)
    ○ WebAuthnは柔軟にするために使われている規格(Web API)

    View full-size slide

  5. What is Passkey
    ● DevFest & Android Dev Summit Japan 2022のえーじさんによるセッショ
    ンも非常にわかりやすいのでおススメ
    ● サービスへの組み込み方は👇がおススメ
    ○ Android Developers
    ■ https://developer.android.com/design/ui/mobile/guides/p
    atterns/passkeys
    ○ DroidKaigi 2023
    ■ 様々なユースケースに利用できる "パスキー" の導入事例の紹介と
    UXの課題解説/ritou

    View full-size slide

  6. Supported Services
    ● いろいろな会社/サービスが続々サポートし始めている
    ○ DocuSign
    ○ Google
    ○ カヤック
    ○ メルカリ
    ○ NTT ドコモ
    ○ PayPal
    ○ Shopify
    ○ LINEヤフー(旧:Yahoo! JAPAN)
    ○ GitHub
    ○ Amazon
    ○ etc….
    https://developers.google.com/identity/passkeys#relying-parties

    View full-size slide

  7. Minimum requirements for practicing Passkey
    ● ローカル認証(生体認証, 知識認証)を有効化している端末
    ● android14 device or androidx.CredentialManager
    ● Digital Asset Links
    ● WebAuthn:PublicKeyCredentialCreationOptionsJSON/PublicKe
    yCredentialRequestOptionsJSON

    View full-size slide

  8. About androidx.CredentialManager
    ● 2023年11月1日に1.2.0(初めてのstable🎉)がリリース
    ● android14に追加されたCredentialManagerをAndroid4.4から使用で
    きるようにする
    ● Passkeyはandroid9以降のみ, それ以下はパスワードとSign in with
    googleのみ

    View full-size slide

  9. About androidx.CredentialManager
    ● Intent引き回し芸を内部でやってくれるので使わない手はない
    ● Smart Lock for Passwords, FIDO2(play-services-fido)を使用して
    いるアプリは移行してあげるとよい
    ○ アプリで検出不能なFIDO認証情報(物理的なセキュリティキー)を使
    用する必要がある場合はまだfidoで行なう必要ある

    View full-size slide

  10. About Digital Asset Links
    ● 雑に言うと$domain/.well-known/assetlink.jsonのこと
    👉つまりドメインを確保してjsonを配置しなければならない

    View full-size slide

  11. About Digital Asset Links
    ● 雑に言うと$domain/.well-known/assetlink.jsonのこと
    🤔Firebase周りで見かけたことあるな

    View full-size slide

  12. About Digital Asset Links
    ● Firebase Dynamic Links(以降FDL)をつかうと見かける
    ○ FDLはサービスシャットダウンがアナウンスされている🥺
    ● 実はFDLのmigration guideが公開されている
    ○ https://firebase.google.com/support/guides/app-links-uni
    versal-links
    ○ その中でFirebase Hostingに移行するセクションがある
    😎Firebase Hostingつかおう

    View full-size slide

  13. Setup Firebase Hosting
    1. Firebase Projectをつくる
    2. Firebase CLIをインストールしてセットアップする
    3. assetlink.jsonを作る
    4. WebAuthnのjsonを作る
    5. Firebase Hostingにdeployする

    View full-size slide

  14. Setup Firebase Hosting
    1. Firebase Projectをつくる
    2. Firebase CLIをインストールしてセットアップする
    3. assetlink.jsonを作る
    4. WebAuthnのjsonを作る
    5. Firebase Hostingにdeployする
    公式サイト通りなので割愛
    https://firebase.google.com/docs/cli

    View full-size slide

  15. Setup Firebase Hosting
    1. Firebase Projectをつくる
    2. Firebase CLIをインストールしてセットアップする
    3. assetlink.jsonを作る
    4. WebAuthnのjsonを作る
    5. Firebase Hostingにdeployする

    View full-size slide

  16. Create AssetLink.json

    View full-size slide

  17. Create AssetLink.json
    targetがドメインをどう扱って良いかを宣言する
    Passkeyを実装するためには👇両方必要
    1. handle_all_urls(URLを処理する)
    2. get_login_creds(認証情報を取り扱う)

    View full-size slide

  18. Create AssetLink.json
    package_nameにはapplicationIdを指定する
    sha256_cert_fingerprintsはkeytoolsかapksignerを使って確認すると早い

    View full-size slide

  19. Setup Firebase Hosting
    1. Firebase Projectをつくる
    2. Firebase CLIをインストールしてセットアップする
    3. assetlink.jsonを作る
    4. WebAuthnのjsonを作る
    5. Firebase Hostingにdeployする

    View full-size slide

  20. Create json for WebAuthn
    ● Passkeyを試すための最小限必要なjsonは👇の2つ
    a. PublicKeyCredentialCreationOptionsJSON
    ■ キー生成をするためのjson
    ■ https://w3c.github.io/webauthn/#dictdef-publickeycrede
    ntialcreationoptionsjson
    b. PublicKeyCredentialRequestOptionsJSON
    ■ 生成済みのキーを取得するためのjson
    ■ https://w3c.github.io/webauthn/#dictdef-publickeycrede
    ntialrequestoptionsjson

    View full-size slide

  21. PublicKeyCredentialCreationOptions

    View full-size slide

  22. PublicKeyCredentialCreationOptions
    RP(Relying Party)にはFirebase Hostingで作ったドメインを指定する

    View full-size slide

  23. PublicKeyCredentialCreationOptions
    user, challengeは本来動的に生成するもの(*今回は横着して固定値)

    View full-size slide

  24. PublicKeyCredentialCreationOptions
    authenticatorSelection.authenticatorAttachmentの値で挙動が変わる
    platform: 現在のデバイスを登録
    cross-platform: 多要素認証を登録する(のでPasskey文脈では使われない)
    null: ユーザーが希望するデバイスを登録

    View full-size slide

  25. PublicKeyCredentialRequestOptions

    View full-size slide

  26. PublicKeyCredentialRequestOptions
    RP(Relying Party)にはFirebase Hostingで作ったドメインを指定する
    challengeは本来動的に生成するもの(*今回は横着して固定値)

    View full-size slide

  27. Setup Firebase Hosting
    1. Firebase Projectをつくる
    2. Firebase CLIをインストールしてセットアップする
    3. assetlink.jsonを作る
    4. WebAuthnのjsonを作る
    5. Firebase Hostingにdeployする

    View full-size slide

  28. Setup Firebase Hosting
    1. Firebase Projectをつくる
    2. Firebase CLIをインストールしてセットアップする
    3. assetlink.jsonを作る
    4. WebAuthnのjsonを作る
    5. Firebase Hostingにdeployする
    😎firebase deployを実行するだけ

    View full-size slide

  29. Practice androidx.CredentialManager
    1. update gradle dependency
    2. implement with CredentialManager

    View full-size slide

  30. Practice androidx.CredentialManager
    1. update gradle dependency
    2. implement with CredentialManager

    View full-size slide

  31. Update gradle dependency
    play-servicesの認証情報を使う場合は
    credentials-play-services-authも追加でimplementationする

    View full-size slide

  32. Practicing androidx.CredentialManager
    1. update gradle dependency
    2. implement with CredentialManager

    View full-size slide

  33. Implement with CredentialManager
    😎あとは基本公式どおり・・・・だけど

    View full-size slide

  34. Implement with CredentialManager

    View full-size slide

  35. Implement with CredentialManager
    WebAuthn用のjsonをHttpClient等で取得して渡す

    View full-size slide

  36. 😎Ready for Passkey
    😎動的なバックエンド実装を用意するならCloud Functionsを使うとよい

    View full-size slide

  37. References
    ● https://developer.android.com/training/sign-in/passkeys
    ● https://developers.google.com/identity/passkeys
    ● https://developers.google.com/digital-asset-links
    ● https://www.youtube.com/watch?v=TWlZzPrlFYA
    ● https://github.com/android/identity-samples
    ● https://github.com/android/codelab-fido2
    ● https://github.com/google/webauthndemo

    View full-size slide