No passwords, no problem
Move beyond passwords with WebAuthn and passkeys
1
@carlastabile
Carla Urrea Stabile
🪑💳
2
@carlastabile
Carla Urrea Stabile
🪑💳
😰
3
@carlastabile
Carla Urrea Stabile
passwords suck
4
@carlastabile
Carla Urrea Stabile
passwords suck
🧠
5
@carlastabile
Carla Urrea Stabile
passwords suck
🧠 🥷
6
@carlastabile
Carla Urrea Stabile
hello, i’m carla! 👋
Sr. Developer Advocate @ Auth0 by Okta
Software Engineer ~10 years
Sometimes I make Youtube videos
7
find me as @CarlaStabile almost everywhere
@carlastabile
Carla Urrea Stabile
disclaimer: I might simplify certain things to try to explain them in an easier way.
8
@carlastabile
Carla Urrea Stabile
whenever you see a QR code, feel free to scan it because your girl is full of resources.✨
9
@carlastabile
Carla Urrea Stabile
✅ share my dislike for passwords
10
@carlastabile
Carla Urrea Stabile
✅ share my dislike for passwords
# TODO: talk about alternatives
# TODO: webauthn
# TODO: passkeys
11
@carlastabile
Carla Urrea Stabile
passwords
🤔
12
@carlastabile
Carla Urrea Stabile
passwordless
😀
13
@carlastabile
Carla Urrea Stabile
“Passwordless authentication is any form of authentication that doesn’t require the user to provide a password at login.”
Yubico Glossary
14
@carlastabile
Carla Urrea Stabile
why is passworless better…
improves user experience
15
@carlastabile
Carla Urrea Stabile
why is passworless better…
improves user experience
📧📱
16
@carlastabile
Carla Urrea Stabile
why is passworless better…
more secure
🔐
17
@carlastabile
Carla Urrea Stabile
why is passworless better…
reduces cost of ownership
(both in time 💸 and emotionally 😰)
18
@carlastabile
Carla Urrea Stabile
how does passwordless work?
🤔
19
@carlastabile
Carla Urrea Stabile
knowledge – something you know
possession – something you have
inherence – something you are
20
authentication factors
@carlastabile
Carla Urrea Stabile
possession factor || inherence factor
21
@carlastabile
Carla Urrea Stabile
possession factor || inherence factor
22
@carlastabile
Carla Urrea Stabile
public-key cryptography
🔑 🔐
23
@carlastabile
Carla Urrea Stabile
👍 multiple authentication factors
🔐 public-key cryptography
👀 phishing-resistant
24
@carlastabile
Carla Urrea Stabile
👍 multiple authentication factors
🔐 public-key cryptography
👀 phishing-resistant
prove intent through deliberate action
25
@carlastabile
Carla Urrea Stabile
Web Authentication API
aka WebAuthn
browser-based API that allows servers to register and authenticate users using public-key cryptography instead of a password.
W3C recommendation, 8 April 2021
26
@carlastabile
Carla Urrea Stabile
27
photo by @sambego
@carlastabile
Carla Urrea Stabile
webauthn in action – create credential
28
@carlastabile
Carla Urrea Stabile
webauthn in action – authenticate
29
@carlastabile
Carla Urrea Stabile
create new webauthn credentials
30
{username}
@carlastabile
Carla Urrea Stabile
create new webauthn credentials
31
{challenge}
@carlastabile
Carla Urrea Stabile
create new webauthn credentials
32
{challenge}
@carlastabile
Carla Urrea Stabile
create new webauthn credentials
33
{challenge}
user interaction
@carlastabile
Carla Urrea Stabile
create new webauthn credentials
34
{
signed challenge
public key
private key ID
}
@carlastabile
Carla Urrea Stabile
create new webauthn credentials
35
{
signed challenge
public key
private key ID
}
@carlastabile
Carla Urrea Stabile
authenticate with webauthn credentials
36
{username}
@carlastabile
Carla Urrea Stabile
authenticate with webauthn credentials
37
{
challenge
private key ID
}
@carlastabile
Carla Urrea Stabile
authenticate with webauthn credentials
38
{
challenge
private key ID
}
@carlastabile
Carla Urrea Stabile
authenticate with webauthn credentials
39
{
challenge
private key ID
}
user interaction
@carlastabile
Carla Urrea Stabile
authenticate with webauthn credentials
40
{
signed challenge
public key
}
@carlastabile
Carla Urrea Stabile
authenticate with webauthn credentials
41
{
signed challenge
public key
}
@carlastabile
Carla Urrea Stabile
42
CTAP2
WebAuthn
FIDO2
@carlastabile
Carla Urrea Stabile
how does the Web Authentication API looks like?
two main methods:
navigator.credentials.create
navigator.credentials.get
43
@carlastabile
Carla Urrea Stabile
how does the API looks like?
two main methods:
navigator.credentials.create
navigator.credentials.get
44
browser-based == JavaScript 😰 … but i got you.
@carlastabile
Carla Urrea Stabile
“Makes your Ruby/Rails web server become a functional WebAuthn Relying Party.”
Thanks @cedarcode 🫶
@carlastabile
Carla Urrea Stabile
create webauthn credential – server side
46
@carlastabile
Carla Urrea Stabile
create webauthn credential – server side
47
@carlastabile
Carla Urrea Stabile
create webauthn credential – client side
48
your frontend needs to call navigator.credentials.create() somehow
@carlastabile
Carla Urrea Stabile
authenticate with webauthn credential (get) – server side
49
@carlastabile
Carla Urrea Stabile
authenticate with webauthn credential (get) – client side
50
your frontend needs to call navigator.credentials.get() somehow
@carlastabile
Carla Urrea Stabile
webauthn >>> passwords
private/public key based authentication
51
@carlastabile
Carla Urrea Stabile
webauthn >>> passwords
private/public key based authentication
phishing-resistant
52
@carlastabile
Carla Urrea Stabile
webauthn >>> passwords
private/public key based authentication
phishing-resistant
you only store public data in your db
53
@carlastabile
Carla Urrea Stabile
webauthn >>> passwords
private/public key based authentication
phishing-resistant
you only store public data in your db
better user-experience
54
@carlastabile
Carla Urrea Stabile
no more passwords! 🎉
55
@carlastabile
Carla Urrea Stabile
✅ share my dislike for passwords
✅ talk about alternatives
✅ webauthn
# TODO: passkeys
56
@carlastabile
Carla Urrea Stabile
can we go even further?
🤔
57
@carlastabile
Carla Urrea Stabile
✨ passkeys ✨
58
@carlastabile
Carla Urrea Stabile
passkeys are a replacement for passwords
59
@carlastabile
Carla Urrea Stabile
passkeys are a replacement for passwords
intuitive
60
@carlastabile
Carla Urrea Stabile
passkeys are a replacement for passwords
intuitive
automatically unique per-service
61
@carlastabile
Carla Urrea Stabile
passkeys are a replacement for passwords
intuitive
automatically unique per-service
breach resistant
62
@carlastabile
Carla Urrea Stabile
passkeys are a replacement for passwords
intuitive
automatically unique per-service
breach resistant
phishing-resistant
63
@carlastabile
Carla Urrea Stabile
technically speaking…
passkeys are FIDO2 discoverable credentials
64
@carlastabile
Carla Urrea Stabile
technically speaking…
passkeys are FIDO2 discoverable credentials
WebAuthn credential is not considered a passkey unless it’s discoverable.
65
@carlastabile
Carla Urrea Stabile
two types of passkeys
66
@carlastabile
Carla Urrea Stabile
two types of passkeys
synced
device-bound
67
@carlastabile
Carla Urrea Stabile
passkeys in action 🚀 – sign up
68
@carlastabile
Carla Urrea Stabile
passkeys in action 🚀 – login
69
@carlastabile
Carla Urrea Stabile
passkeys in action 🚀 – multi-device feature
70
@carlastabile
Carla Urrea Stabile
✅ share my dislike for passwords
✅ talk about alternatives
✅ webauthn
✅ passkeys
71
@carlastabile
Carla Urrea Stabile
moving forward… 👀
72
@carlastabile
Carla Urrea Stabile
where can you use passkeys already?
73
… and many others!
@carlastabile
Carla Urrea Stabile
webauthn.me
74
@carlastabile
Carla Urrea Stabile
passkeys.dev
75
@carlastabile
Carla Urrea Stabile
…it’s been a ride 😮💨
76
@carlastabile
Carla Urrea Stabile
…at least it’s been a ride without having to deal with passwords
77
@carlastabile
Carla Urrea Stabile
thank you! 🫶
78
@carlastabile
Carla Urrea Stabile