Trigger windows hello authentification (same as in the registration process)

[seba9999]

I've implemented the registration process and in my Chrome browser it automatically triggers windows hello prompt to enter my password. Then it complete the challenge and sending it back to the server saving the authenticator.

But when i'm trying to do the authentification flow Chrome trigger a wild modal which ask for a passKey :

How can I trigger the windows hello prompt again ?

Here is my code (Very similar to the docs) :

// Human-readable title for your website
const rpName = 'SimpleWebAuthn Example';
// A unique identifier for your website
const rpID = 'localhost';
// The URL at which registrations and authentications should occur
const origin = `http://${rpID}:3000`;

const getRegistrationOptions = async (req, res) => {
  const login = req?.query?.login;
  const user = await UserWebAuthn.findOne({ login });
  if (user === null) {
    // Create user on the fly !
    const user = new UserWebAuthn({ login });
    const options = await generateRegistrationOptions({
      rpName,
      rpID,
      userID: user._id,
      userName: user.login,
      // Don't prompt users for additional information about the authenticator
      // (Recommended for smoother UX)
      attestationType: 'none',
      // Prevent users from re-registering existing authenticators
      excludeCredentials: [],
      // See "Guiding use of authenticators via authenticatorSelection" below
      authenticatorSelection: {
        // Defaults
        residentKey: 'preferred',
        userVerification: 'preferred',
        // Optional
        authenticatorAttachment: 'platform',
      },
    });
    user.challenge = options.challenge;
    await user.save();
    res.status(200).json({ options });
  } else {
    res.status(404).json({ message: 'Login already used' });
  }
};

const getAuthentificationOptions = async (req, res) => {
  const login = req?.query?.login;
  const user = await UserWebAuthn.findOne({ login });
  if (user === null) {
    res.status(404).json({ message: 'User not found' });
  } else {
    const previousAuthenticator = await Authenticator.findOne({ userId: user?._id });
    console.log('previousAuthenticator = ', previousAuthenticator);
    const options = await generateAuthenticationOptions({
      rpID,
      allowCredentials: [
        {
          id: previousAuthenticator.credentialID,
          type: 'public-key',
          transports: previousAuthenticator.transports,
        },
      ],
      userVerification: 'preferred',
    });
    user.challenge = options.challenge;
    await user.save();
    res.status(200).json({ options });
  }
};

const verifyRegistration = async (req, res) => {
  const { body } = req;
  const { login, challengeResponse } = body;
  const user = await UserWebAuthn.findOne({ login });
  if (user === null) {
    res.status(404).json({ message: 'Error ! user not found' });
    console.log('@@@ ERREUR : [verifyRegistration] : user not found');
  } else {
    let verification;
    try {
      verification = await verifyRegistrationResponse({
        response: challengeResponse,
        expectedChallenge: user?.challenge,
        expectedOrigin: origin,
        expectedRPID: rpID,
      });
      res.status(200).json({ ok: verification.verified });
      if (verification.verified) {
        // save authenticator :
        console.log('+++ Creating new Authenticator (registrationInfo) : ', verification.registrationInfo);
        const auth = new Authenticator(verification.registrationInfo);
        auth.userId = user._id;
        await auth.save();
      }
    } catch (error) {
      console.error(error);
      return res.status(400).send({ message: error.message });
    }
  }
};

const verifyAuthentification = async (req, res) => {
  const { body } = req;
  const { login, challengeResponse } = body;
  const user = await UserWebAuthn.findOne({ login });
  if (user === null) {
    res.status(404).json({ message: 'Error user not found' });
    console.log('@@@ Error : [verifyAuthentification] : user not found');
  } else {
    let verification;
    const previousAuthenticator = await Authenticator.findOne({ userId: user?._id });
    try {
      verification = await verifyAuthenticationResponse({
        response: challengeResponse,
        expectedChallenge: user?.challenge,
        expectedOrigin: origin,
        expectedRPID: rpID,
        authenticator: previousAuthenticator,
        requireUserVerification: true, // Should it be true ? (I tried both)
      });
      res.status(200).json({ ok: verification.verified });
      if (verification.verified) {
        // update counter on authenticator :
        const nextCounter = verification.authenticationInfo.newCounter;
        previousAuthenticator.counter = nextCounter;
        await previousAuthenticator.save();
      }
    } catch (error) {
      console.error(error);
      return res.status(400).send({ message: error.message });
    }
  }
};

I've noticed that I don't have any transport array in my registrationInfo and thus in my Authenticator object .. Is this an expected thing ?

[MasterKale]

Hey @seba9999, what version of Chrome and Windows are you using? iirc there's a Chrome bug on Windows where transports in allowCredentials entries are not sent to Windows Hello and so you have to choose every time. I'm trying to find out which version of Chrome fixes this, I think Chrome 120? I'll try and confirm this with someone who'll know for sure.

[seba9999]

Actually I am using Chrome 120 !

But I saw in your code example ( Here ) that you're saving the transports value in the Authenticator Object not from the registrationInfo but from the data sent from the front ( created by startRegistration )

I've added this and the windows hello is correctly triggered ! :)