Passkeyme now supports Discoverable Credentials! This new feature takes user authentication to the next level, providing a more seamless and secure experience for your users. 🚀

What are Discoverable Credentials?​

Discoverable Credentials, also known as Resident Keys, allow users to authenticate without needing to remember and enter their username. This is a significant improvement over non-discoverable credentials, where users must input their username every time they log in. With discoverable credentials, the authentication dialog will automatically display all available credentials for the user to choose from.

Non-Discoverable Credentials​

Discoverable Credentials​

Pros and Cons of Discoverable Credentials​

Pros​

• User Convenience: Users don’t need to remember and type their usernames. They can simply select their credential from a list.
• Enhanced Security: Reduces the risk of phishing attacks as users do not type their usernames, which could be intercepted by malicious actors.
• Improved User Experience: Faster and easier authentication process.

Cons​

There are normally some downsides to using discoverable credentials, however Passkeyme takes care of these for you!

This includes:

• Storage Requirements: Discoverable credentials need to be stored securely on the device - but Passkeyme takes care of storage of the credential, securely, and anonymously!

• Complexity: Implementing and managing discoverable credentials can add complexity to the authentication process - except if you use Passkeyme, and then its a breeze!

• Device Dependency: If a user loses their device, they could lose access to their credentials unless they have a backup method - this is still true, however with Passkeyme:

  • The user can still enter their username, and use non-discoverale mode and get access to their Passkey
  • Fallback-flow is being built as we speak - watch this space!

• Comparatively worse UX: Compared to non-discoverable, discoverable credentials require the user to select the correct passkey, which is an extra step. If it is possible to use non-discoverable credentials, this is recommended - i.e. if the username is cached on the device, or can be input buy the user

How to Enable Discoverable Credentials in Passkeyme​

Activating discoverable credentials in Passkeyme is simple. Follow these steps:

Step 1: Edit the Application​

Navigate to your application settings in the Passkeyme dashboard and click on "Edit Application".

Step 2: Set the "Allow discoverable credentials" Flag​

In the application settings, set the "Allow discoverable credentials" flag to true.

Step 3: Modify Your Authentication Requests​

When sending authentication requests, ensure that you do not include a username in your POST requests to /start_authentication and /end_authentication.

Note, even with Discoverable enabled, you can still trigger a non-discoverable (which is less prone to device-specific operability issues) by specifying the username. If the username is known - i.e. if its a device that has previously logged in with the passkey and you have stored the username locally, we reccommend to use non-discoverable credentials so the user does not have to select their username from the Passkey dialog, which is cleaner.

POST /start_authentication
{
}

POST /complete_authentication
{
    "credential": "...."
}

Passkeyme.com supports Passkeys!​

Well, it would be rude not to - you can now register a passkey for Passkeyme.com!

I do have to take a bow - it was pretty straightforward to set up. The basic flow is as follows:

1. User logs in as Normal
2. Go to the Upper RHS Passkey menu item
3. Follows the prompts to register their passkey
4. Log out
5. Select their username from the dropdown on the login screen
6. Click Sign in with Passkey
7. Done!

Implementation​

To implement, I went through the following steps:

1. Install the passkeyme-web-sdk via

npm install passkeyme-web-sdk

2. Then added a RegisterPasskey component to my React frontend:

import PasskeymeSDK from 'passkeyme-web-sdk';
const passkeymeSDK = new PasskeymeSDK();

...

      let challengeResponse = await axiosClient.post(`/api/auth/register-passkey`, {
        username: thisuser.username,
        displayname: thisuser.name
      });

      const passkeyResponse = await passkeymeSDK.passkeyRegister(challengeResponse.data.challenge);

      let completeResponse = await axiosClient.post(`/api/auth/register-passkey/complete`, {
        username: thisuser.username,
        credential: passkeyResponse.credential
      });

3. In the above, I added two new endpoints to my backend:

/auth/register-passkey
/auth/register-passkey/complete

These delegate to the passkeyme.com/webauthn/:appid/start_registration and complete_registration endpoints

4. For Authentication, I added the following two endpoints to my backend:

/auth/authenticate-passkey
/auth/authenticate-passkey/complete

Which similarly delegate to the passkeyme.com/webauthn/:appid/start_authentication and complete_authentication endpoints

5. Add the corresponding calls to my frontend login component:

      let challengeResponse = await axiosClient.post(`/api/auth/authenticate-passkey`, {
        username
      });

      const passkeyResponse = await passkeymeSDK.passkeyAuthenticate(challengeResponse.data.challenge);

      let completeResponse = await axiosClient.post(`/api/auth/authenticate-passkey/complete`, {
        username,
        credential: passkeyResponse.credential
      });

5. Persist the array of usernames, and last used username in localStorage for convenience - you could also require the user to enter the username if that is more appropriate.

The Passkey form looks like (Its a React component using Chakra-UI):

      {passkeyUser && (
        <>
        <Box mb="6">
          <Select value={passkeyUser} onChange={(e) => setPasskeyUser(e.target.value)}>
            {passkeymeUsers.map((user: string) => (
              <option value={user} key={user}>{user}</option>
            ))}
            </Select>
          <Button mt="6" type="submit" width="full" colorScheme="brand" onClick={() => doPasskeyAuthenticate(passkeyUser)}>
            {translate("pages.login.passkey.button", "Sign in with Passkey")}
          </Button>
        </Box>
        <Divider></Divider>
        </>
      )}

Note it will only show the Passkey Box if there is a passkeyme username in localStorage, so if the user has not registered a Passkey, it won't be confusing.

Key Points​

• Note it supports multiple passkeys, you select the one you want to log in with from the dropdown. These are just maintained in the browser localStorage - its just the usernames, so its safe.

• This actually does serve to showcase how you can implement passkeys with a simple workflow that yields an awesome user-experience! It demonstrates a best practice for implementing passkeys, i.e:

1. Register the passkey from an Authenticated user inside your app - your backend proxy to start/finish_registration should require an authenticated session
2. User then just needs to specify their username to log in subsequently
3. You can persist the username(s) on the device for convenience for the user.

• Note also, the standard login serves as a Fallback. It is vital to always have a Fallback mechanism in case the user cannot access their Passkey - e.g. they have lost access to their iCloud, or lost the only device they use, etc.

More on the Fallback flow in future - this will be where I focus next, as it is important to get it right.

Conclusions​

This was a simple, yet straightforward implementation using the Passkeyme passkeyme-web-sdk and API endpoints. It took a couple of hours to put together, yet it resulted in a quite elegant UX.

It does highlight that while Passkeys don't have to be complex to implement - your User eXperience is extremely important and needs careful attention - don't just shoehorn it in, spend time on the User Journey. Or if you can't - then follow the above blueprint!

So, what are you waiting for? You can add Passkeys to your app today!

Usage Charts added!​

Passkeyme now includes usage reports - check out the Usage button from the Applications list/show pages!

Charts are interactive, so you can select date ranges, and view usage at monthly points.

Once you have built up a few months of usage, these will prove to be useful - but don't worry if there's nothig in there when you're just getting set up!

Why Passkeys Are Important and the Problems They Solve​

Introduction​

In today's digital age, security is a top priority for both users and developers. Traditional authentication methods, such as passwords, have been the cornerstone of online security for decades. However, they come with significant drawbacks. Passkeys, a modern alternative to passwords, offer a solution to many of these issues. In this blog post, we'll explore why passkeys are important and the problems they solve.

The Problem with Passwords​

Passwords have long been the go-to method for securing online accounts, but they have several inherent flaws:

1. Weak Passwords: Many users choose simple, easily guessable passwords, making their accounts vulnerable to attacks.
2. Password Reuse: Users often reuse passwords across multiple sites. If one site is compromised, all accounts using that password are at risk.
3. Phishing Attacks: Phishing attacks trick users into revealing their passwords to malicious actors, leading to account breaches.
4. Credential Stuffing: Automated attacks use stolen username-password pairs to gain unauthorized access to accounts.
5. Management Overhead: Users need to remember numerous passwords, leading to poor password practices and a reliance on insecure storage methods.

Enter Passkeys​

Passkeys leverage public-key cryptography to provide a more secure and user-friendly authentication method. Here's how they work and the problems they solve:

1. Enhanced Security:

   • Passkeys use asymmetric cryptography, generating a unique public-private key pair for each service. The private key never leaves the user's device, while the public key is stored on the server.
   • This method ensures that even if a server is compromised, the user's private key remains secure.

2. Phishing Resistance:

   • Passkeys are inherently resistant to phishing attacks. Since the private key never leaves the user's device, attackers cannot steal it through phishing attempts.

3. Elimination of Password Reuse:

   • Each service generates a unique key pair, eliminating the risk associated with password reuse. Compromising one service does not jeopardize others.

4. Simplified User Experience:

   • Passkeys simplify the login process. Users no longer need to remember complex passwords or use password managers. Authentication can be as simple as using a biometric scanner or entering a PIN.

5. Protection Against Credential Stuffing:

   • Passkeys render credential stuffing attacks ineffective. Since there are no shared passwords to exploit, attackers cannot use stolen credentials across multiple sites.

Implementing Passkeys with Passkeyme​

Passkeyme makes it easy for developers to integrate passkeys into their web and mobile applications. Our platform provides a robust REST API and cross-platform SDKs, allowing for seamless integration and enhanced security for your users.

Getting Started with Passkeyme​

1. Integrate the API: Use our REST API to handle the passkey registration and authentication processes securely.
2. Leverage SDKs: Our SDKs for Web, iOS, and Android make it easy to implement passkey functionality across different platforms.
3. Enhance User Experience: Provide your users with a streamlined, secure authentication method that improves their overall experience and reduces the risk of account breaches.

Conclusion​

Passkeys represent the future of online authentication, addressing many of the critical issues associated with traditional passwords. By leveraging public-key cryptography, passkeys offer enhanced security, resistance to phishing, and a simplified user experience. With Passkeyme, integrating passkeys into your applications has never been easier. Embrace the future of authentication and protect your users with Passkeyme.

What is Passkeyme?​

Passkeyme is a SaaS platform that allows developers to easily integrate passkeys into their web or mobile applications. It provides a secure and user-friendly authentication alternative to traditional passwords.

Why Use Passkeyme?​

• Enhanced Security: Passkeys leverage public-key cryptography, reducing the risk of phishing, credential stuffing, and other common attacks.
• User-Friendly: Users no longer need to remember passwords, offering a better user experience.
• Easy Integration: Passkeyme can be integrated into existing authentication frameworks, complementing traditional authentication methods.

Getting Started​

To get started with Passkeyme, check out our documentation.