20231109_WebAuthnを使ったパスワードレス認証をRailsアプリケーションで実装する

After Kaigi on Rails Night LT登壇資料
メドピア株式会社 伊藤悠真
https://smartbank.connpass.com/event/299631/

Transcript

1. WebAuthnを使ったパスワードレス 認証をRailsアプリケーションで実装 する 2023/11/09 @After Kaigi on Rails Night メドピア株式会社 伊藤悠真
2. Kaigi on Rails お疲れ様でした！
3. 気になったセッション
4. 自己紹介 • 伊藤悠真 (@yuma_ito_bd) • フィッツプラス（メドピアの子会社）の サーバーサイドエンジニア ◦ 特定保健指導の効率化支援ツール Tonoelの開 発 • Ruby/Rails歴2年弱 • 趣味：バスケ、コーヒー
5. パスワードを忘れたことがある人 ✋
6. パスワードが不要な認証方式が あります！
7. 体験してみよう！ https://webauthn.io
8. 3つのキーワード • FIDO • WebAuthn • パスキー
9. FIDO （Fast Identity Online） とは？ • パスワードレスで認証するための技術 • 指紋や虹彩などの生体情報やPIN、専用の セキュリティーキーを用いる • 公開鍵暗号方式を利用し、サーバーにはパ スワードではなく公開鍵を保存する
10. FIDO認証のメリット • UXの向上 ◦ パスワードを覚える必要がない • セキュリティーの向上 ◦ 秘匿情報を通信しない（秘密鍵は認証器に安全に保 存） ◦ Webサービスごとに異なる公開鍵を登録できる
11. 3つのキーワード • FIDO • WebAuthn • パスキー
12. WebAuthn ＝WebブラウザでFIDO認証を 実現する仕様（API）
13. 認証器 ブラウザ WebAuthnの仕組み（登録） サーバ ①チャレンジ要求 ②チャレンジ生成 ③本人認証を要求 ④本人認証 ⑤公開鍵/秘密鍵を 生成、端末に秘密鍵 を保存 ⑥公開鍵など署名情報を送信 ⑦署名情報を検証 ⑧公開鍵を保存
14. 認証器 ブラウザ WebAuthnの仕組み（認証） サーバ ①チャレンジ要求 ②チャレンジ生成 ③本人認証を要求 ④本人認証 ⑤端末に保存された 秘密鍵で署名 ⑥署名情報を送信 ⑦DBに保存された公開 鍵で署名情報を検証
15. 3つのキーワード • FIDO • WebAuthn • パスキー
16. 秘密鍵をクラウドで同期する仕組み 例：認証器(iPhone)が変わっても同じAppleアカウン トにログインしていればWebサービスにログインでき る （狭義の）パスキー
17. （広義の）パスキー WebAuthnによるパスワードを使わない認証 パスキー対応サービス： Google, Apple, Microsoft, Amazon, GitHub, 1Password, Yahoo! JAPAN, ドコモ, メルカリなど続々対応！
18. RailsでWebAuthnの認証機能を 実装してみたい！
19. けど署名の検証とか仕様が難し そう・・・ （実際、難しかったです）
20. アプリの公開が間に合いませんでした
21. WebAuthn用のGem • webauthn-ruby ◦ WebAuthnの認証サーバで必要な処理を担ってくれるGem • warden-webauthn ◦ RackベースのミドルウェアWardenでWebAuthn認証を行う Gem • devise-passkeys ◦ devise（有名な認証用Gem）でWebAuthn認証を行うGem
22. WebAuthn用のnpmパッケージ • フロントエンドで必要な処理（認証器へのリクエスト、 パラメータのbase64変換）を担う • @github/webauthn-json (star: 680) • @simplewebauthn (star: 981) ◦ サーバサイド（Node.js）の処理やTypeScriptの型情報が用意されている • @passwordless-id/webauthn (star: 213)
23. Model • User ◦ deviseの認証で使うモデル ◦ webauthn_id (ユーザID) • Passkey ◦ 公開鍵を管理するモデル ◦ label ◦ public_key ◦ external_id ◦ sign_count
24. Model
25. routes チャレンジ要求用エンドポイント
26. Controller （登録） 認証サーバー情報 チャレンジの生成 署名の検証、公開鍵の保存
27. JavaScript チャレンジ生成用URL ブラウザがサポート しているか確認 navigator.credentials. create()を内部で実行
28. まとめ • FIDO認証、WebAuthenの仕組み、パスキーについ て • FIDO認証できる簡単なRailsアプリケーションのを実 装方法について • FIDO認証の実装をぜひ検討してみてください！