by Stepan Suvorov
Stepan Suvorov
-
CTO @
-
Google Developer Expert
-
🇺🇦 originally from Ukraine
-
GenAI Evangelist
#standWithUkraine 🇺🇦
Christiaan Brand
Security & Identity, Google
Thanks to
Maud Nalpas
Web security & privacy, Google
Auth Evolution
Something you know
Something you have
Something you are
Somewhere you are
Passwors?
- High risk of Identity theft and phishing
- Easily revealed to 3rd Party (accidentally or not)
- Easily hacked using hash matching tables
- Sharing as plain text
- The strength of the password is not always verified automatically
Password managers?
MFA?
Hardware Keys?
Passkeys
How Passkeys Work?
FIDO2 Components
How Passkeys Work?
Sign-up
Public 🔑
 Private 🔑
CTAP
WebAuthn
How Passkeys Work?
Sign in
Public 🔑
 Private 🔑
Public 🔑
challenge
signed package with challenge
Also good to know
Syncing
Passkeys are not stored on a single device
Cross-device
Passkeys on one device can be used on a different device
Discoverable
Passkeys contain metadata that allows your system to present passkey to you
Passkeys
for personal use
Can I Use it?
keep secrets at Google/Apple?
More about implementation
Passkey Creation
navigator.credentials.create({
publicKey: options
});
Passkey Creation
const publicKeyCredentialCreationOptions = {
challenge: new ArrayBuffer([219]),
rp: {
name: "Slides",
id: "slides.com",
},
user: {
id: new ArrayBuffer([137]),
name: "elisabeckett",
displayName: "Elisa Beckett",
},
pubKeyCredParams: [{alg: -7, type: "public-key"}],
authenticatorSelection: {
authenticatorAttachment: "platform",
requireResidentKey: true,
},
timeout: 30000
};
const credential = await navigator.credentials.create({
publicKey: publicKeyCredentialCreationOptions
});
Use a Passkey
navigator.credentials.get({
publicKey: requestOptions,
mediation: 'conditional'
});
Use a Passkey
// Availability of 'window.PublicKeyCredential' means WebAuthn is usable.
if (window.PublicKeyCredential &&
PublicKeyCredential.isConditionalMediationAvailable) {
// Check if conditional mediation is available.
const isCMA = await PublicKeyCredential.isConditionalMediationAvailable();
if (isCMA) {
// Call WebAuthn authentication
}
}
const publicKeyCredentialRequestOptions = {
// Server generated challenge
challenge: new ArrayBuffer([219]),
// The same RP ID as used during registration
rpId: 'slides.com',
};
const credential = await navigator.credentials.get({
publicKey: publicKeyCredentialRequestOptions,
// Specify 'conditional' to activate conditional UI
mediation: 'conditional'
});
Demo Time
passkeys-demo.appspot.com
Conclusion
-
Passkeys are here
- They are a significant UX improvement over passwords
- They provide much better security guarantees (strong phishing resistance)
-
It might take time for regulation to catch up
-
Passkeys are new: It’ll take users some time to become accustomed
- Understanding when passkeys are synced, and when they’re not, is hard
-
Thank you for your attention.
Questions?
Passkeys: Prepare for the Future for AmsterdamJS
By Stepan Suvorov
Passkeys: Prepare for the Future for AmsterdamJS
- 56