I'm trying to implement a FIDO onboarding application for an app. To create the user credentials with WebAuthn API I use:
navigator.credentials.create(options)
This return a promise that resolves with user credentials when allowed. However, if instead of allowing, the user cancel the credentials creation, then a DOMException with with name NotAllowedError is thrown.
In the app, the credentials creation call to the Web Authentication API is triggered when the user clicks a button, that has an onClick which points to a function that also toggles a loading animation before attempting to create the credentials. In order to provide a good user experience, when the user clicks to cancel, I want to handle this exception, toggle the loading animation off and then display the button to create credentials again.
I want to know the best practices when handling this scenario. I don't know enough about this flow to even know if it's safe to wrap the call in a try-catch then handle every error with the name of NotAllowedError or if this Error is also thrown in other scenarios, for example, when failing to contact the user device, which in this case could cause the user that actually does want to allow credentials creation to be trapped in an infinite loop of clicking to create credentials, clicking allow, getting a NotAllowedError, having the button to create credentials displayed over again.
try {
const credentials = await navigator.credentials.create(options)
// do whatever
} catch (err) {
if (err instanceof DOMException && err.name === "NotAllowedError") {
// handle user cancelation
return
}
// handle other scenarios
}
Long story short, I want to handle this scenario of user cancellation specifically and any other scenario I would handle the error some other way.
from Handling user cancellation when creating credentials with WebAuthn API
No comments:
Post a Comment