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

WebAuthn/FIDOのUX徹底解説 ~実サービスへの導入イメージを添えて~ / buil...

ritou
August 30, 2019

WebAuthn/FIDOのUX徹底解説 ~実サービスへの導入イメージを添えて~ / builderscon tokyo 2019 ritou

下記カンファレンスでの発表資料です。
https://builderscon.io/builderscon/tokyo/2019/session/c9da9bfb-c97c-4f93-a496-ff83b3ca61bc

ritou

August 30, 2019
Tweet

More Decks by ritou

Other Decks in Technology

Transcript

  1. ͍ͱ͏Γΐ͏ • (ג)ϛΫγΟ ΤϯδχΞ - Identity / Platform / Payment?

    • OpenID ϑΝ΢ϯσʔγϣϯɾδϟύϯ ΤόϯδΣϦετ • Blog : ritou.hatenablog.com • Twitter : @ritou (ळాͷೣ) • ˌidcon, #iddance !2
  2. FIDO(First IDentity Online) • ϩʔΧϧೝূΛར༻ • ύεϫʔυ΍ੜମ৘ใ͕௨৴࿏ΛྲྀΕͳ͍ • (ੜମೝূʹݶΒͣ)༷ʑͳೝূํࣜͱͷ૊Έ߹Θͤ ͕Մೳ

    • ެ։伴҉߸ํࣜΛ༻͍ͨ̎ͭͷػೳ • ొ࿥ : ॺ໊ͱެ։伴৘ใΛૹ৴ • ೝূ : ॺ໊Λૹ৴ !20
  3. FIDO2 Project • FIDO2 : WebΞϓϦέʔγϣϯ͔Β΋FIDO • WebAuthn (Web Authentication

    API) • FIDOΛར༻͢ΔαʔϏε͕ݺͼग़͢ JavaScript API • CTAP (Client To Authenticator Protocol) • ηΩϡϦςΟΩʔͱ΍ΓͱΓ͢ΔͨΊͷ࢓༷ • ϒϥ΢β͕࣮૷ !22
  4. WebAuthn(WebAuthentication API) • 2019/3/4 W3Cקࠂ https://www.w3.org/TR/ webauthn/ • ఆٛ͞Ε͍ͯΔ2ͭͷAPI •

    navigator.credentials.create() : ొ࿥ • navigator.credentials.get() : ೝূ !23
  5. WebAuthn - ొ৔ਓ෺ !24 • Relying Party : WebΞϓϦ •

    Authenticator : ηΩϡϦςΟΩʔɺσόΠε • Client : Webϒϥ΢β
  6. WebAuthn - ొ࿥ϑϩʔ !27 1. ొ࿥༻ύϥϝʔλ࡞੒
 (RP৘ใ,Ϣʔβʔ৘ใ, ϩʔΧϧೝূͷ༗ແͳͲ) 3. Authenticator/Platform

    ͷػೳΛݺͼग़͢ 2. JS APIͷݺͼग़͠ 4.ϩʔΧϧೝূ 伴ϖΞੜ੒ ॺ໊࡞੒ 5. ৽͍͠ެ։伴ͱॺ໊ 6. JS API͔Βͷ໭Γ஋ 7.֤छݕূ ެ։伴ͷอଘ Authenticator (SecurityKey etc…) Client (ϒϥ΢β) Relying Party (αʔϏε)
  7. ొ࿥༻ύϥϝʔλͷࢦఆྫ !28 • Attachment : Authenticatorͷछྨ • User Verification :

    ϩʔΧϧೝূͷཁٻ • Require ResidentKey : Ϣʔβʔ৘ใΛอଘ
  8. ొ࿥༻ύϥϝʔλͷࢦఆྫ !33 • Attachment : Authenticatorͷछྨ • User Verification :

    ϩʔΧϧೝূͷཁٻ • Require ResidentKey : Ϣʔβʔ৘ใΛอଘ
  9. ొ࿥༻ύϥϝʔλͷࢦఆྫ !38 • Attachment : Authenticatorͷछྨ • User Verification :

    ϩʔΧϧೝূͷཁٻ • Require ResidentKey : Ϣʔβʔ৘ใΛอଘ
  10. WebAuthn - ೝূϑϩʔ !40 Authenticator (SecurityKey etc…) Client (ϒϥ΢β) Relying

    Party (αʔϏε) 1. ೝূ༻ύϥϝʔλ࡞੒
 (ެ։伴৘ใ, ϩʔΧϧೝূͷ༗ແͳͲ) 3. Authenticator/Platform ͷػೳΛݺͼग़͢ 2. JS APIͷݺͼग़͠ 4.ϩʔΧϧೝূ ॺ໊࡞੒ 5. ॺ໊ 6. JS API͔Βͷ໭Γ஋ 7.֤छݕূ ೝূॲཧ
  11. ೝূ༻ύϥϝʔλͷࢦఆྫ !44 • AllowCredentials : ެ։伴ͷࢦఆ • ͋Γ : RP͕อ͍࣋ͯ͠Δެ։伴Λࢦఆ

    • ͳ͠(ۭ) : Authenticator ʹอଘ͞Ε͍ͯΔ ৘ใΛར༻ -> Resident Key
  12. WebAuthnͷϑΟογϯά଱ੑ (௥Ճೝূ) !50 ϑΟογϯάϝʔϧɺ ϝοηʔδ ϑΟογϯάαΠτ ʢFYBNQMFJOGPʣ ਖ਼نͷαΠτ FYBNQMFDPN *%ύεϫʔυ

    Ξαʔγϣϯ ॺ໊ͳͲ औಘͨ͠ *%ύεϫʔυ Ξαʔγϣϯ PSJHJO୯ҐͰ伴ϖΞΛ ੜ੒͍ͯ͠ΔͷͰ ϑΟογϯάαΠτʹ ϩάΠϯͰ͖ͳ͍
  13. WebAuthnͷϑΟογϯά଱ੑ (௥Ճೝূ) !51 ϑΟογϯάϝʔϧɺ ϝοηʔδ ϑΟογϯάαΠτ ʢFYBNQMFJOGPʣ ਖ਼نͷαΠτ FYBNQMFDPN *%ύεϫʔυ

    Ξαʔγϣϯ ॺ໊ͳͲ औಘͨ͠ *%ύεϫʔυ Ξαʔγϣϯ PSJHJO୯ҐͰ伴ϖΞΛ ੜ੒͍ͯ͠ΔͷͰ ϑΟογϯάαΠτʹ ϩάΠϯͰ͖ͳ͍ ϑΟογϯάαΠτ޲͚ͷ ΞαʔγϣϯΛਖ਼نͷαΠτʹ ૹͬͯ΋ݕূࣦഊ͢Δ
  14. ࠷ۙ஫໨ͷFIDO/WebAuthnͷରԠঢ়گ !52 • Android • Authenticator: Android 7.0~, Security Key

    • Client: Chrome, Firefox • Windows 10 • Authenticator: Windows Hello, Security Key • Client : Microsoft Edge, Chrome, Firefox…
  15. ʮ௥Ճೝূͱͯ͠ͷಋೖʯ ͷϙΠϯτ • ෳ਺ͷೝূํࣜΛఏڙ : ʮ٧Έʹ͍͘ʯ࢓૊Έ • Authenticatorͷ੍ݶ • ໊લͷઃఆ

    • ೝূཁٻͷλΠϛϯά • ύεϫʔυೝূ / ιʔγϟϧϩάΠϯͷޙ • ύεϫʔυ֬ೝͷ୅ସͱͯ͠ !76
  16. Yahoo! JAPANͷಋೖྫ • Android + Chrome ͱݴ͏૊Έ߹Θͤʹݶఆ • ͦΕҎ֎ͷ؀ڥͰ͸ϝʔϧ /

    SMSͰͷ֬ೝίʔ υૹ৴౳Λར༻ • ϢʔβʔࣝผޙʹೝূํࣜΛग़͠Θ͚ • ొ࿥ޙͷ࠶ೝূͰ΋ಉ͡ೝূํࣜ !82
  17. Microsoftͷಋೖྫ • Windows Hello͕࢖͑Δ؀ڥ + MS Edgeݶఆ • Windows Hello୯ମ

    • USB/NFCͳηΩϡϦςΟΩʔ΋ར༻Մೳ • αΠϯΠϯΦϓγϣϯͱͯ͠Ϣʔβʔࣝผલʹཁٻ • Resident KeyʹΑΔϢʔβʔબ୒ !88
  18. ʮϝΠϯͷೝূํࣜͱͯ͠ͷಋೖʯ ͷϙΠϯτ • UserVerification͸ඞਢ • αϙʔτ؀ڥ(Authenticator/Client)ͷ੍ݶ • ੍ݶ͋Γ = ϝϯςφϯε͕ඞཁ

    • ੍ݶͳ͠ = FIDO2ରԠ؀ڥͳΒ͹উखʹରԠՄೳ • ೝূཁٻͷλΠϛϯά • ϝΞυͰࣝผޙʹઃఆͱ؀ڥͷ൑ఆ • ResidentKeyΛར༻ͯ͠Ϣʔβʔબ୒ !94