Graceful error when platform Authentication attempted on a different device?

[cormip]

I currently allow users to register both platform and cross-platform authenticators, and save the CredentialID, AAGUID, attachment type, etc in the database so that I can present the user labeled options when logging in. e.g.

Login with:

• YubiKey 5 Series with NFC
• Windows Hello Hardware Authenticator

This works great until a user attempts to authenticate themselves using a 'platform' authenticator on a device other than the one on which they registered. (e.g. Windows Hello)

I specify only the selected authenticator in allowCredentials, but when attempting startAuthentication the browser reverts to trying to authenticate using my security key, despite it not being listed in allowCrednetials?! If I additionally specify transports="internal" in allowCredentials when attachment is platform then startAuthentication throws a lengthy error that isn't identified by identifyAuthenticationError:

Failed to execute 'get' on 'CredentialsContainer': Failed to read the 'publicKey' property from 'CredentialRequestOptions': Failed to read the 'allowCredentials' property from 'PublicKeyCredentialRequestOptions': Failed to read the 'transports' property from 'PublicKeyCredentialDescriptor': The provided value cannot be converted to a sequence.

What I would like to have occur is to instead show the user a graceful error message that instead says something like: "It appears that you are trying to sign in using an authentication method that was registered on a different device. You should try... (etc)."

Any suggestions as to how I can reliably catch users attempting to use a platform authenticator from a different device?

[MasterKale]

User agent sniffing for OS (and browser, for macOS) is the way to go here. If you notice an "attachment": "platform" credential get registered from a browser user agent that indicates Chrome on Windows, then you wouldn't want to return that credential back in allowCredentials for an authentication attempt in a browser with a user agent that indicates Safari on iOS. That's the common technique for tackling this issue.

Failed to read the 'transports' property from 'PublicKeyCredentialDescriptor': The provided value cannot be converted to a sequence.

As for this, transports is an array, and so you'll want to specify transports=["internal"] instead.

As for manipulating transports, I'd suggest just letting it be and not trying to manipulate the value. Besides, if you take my earlier advice and check the user agent of a platform authenticator credential prior to auth, you won't even return that empty-transports credential for auth, and so the browser won't prompt for security key auth with it.

As for why the browser is prompting for security key (because the platform authenticator is telling Chrome it doesn't recognize the credential), it's because when a transports list is empty then Chrome can't really say it's not available, but it knows that the platform authenticator isn't an option. In some environments users will see a choice of "security key" or "another device" during auth, then Hybrid auth is available. Something to be aware of as you continue down this path ✌️

Does this help make sense of what you're observing?

[cormip]

Thanks for the prompt reply. I did just figure out that not passing transports as an array was messing things up. I now do get a proper error, and will look into the user-agent tracking to help improve the user flow. Thanks again.