Entering usernames, emails, identifiers, and passwords is a massive pain for users. It’s even worse on mobile as the use has to be fiddle around with.
Browsers have done a number of things over the years to help with this problem. We started with enhancing autofill across browsers by making it more intelligent and more secure, but more importantly, synchronized across browsers (so that if you enter data on your desktop it is available instantly on your mobile). Autofill has helped us make signing up for services more efficient and it has also improved the accuracy and speed for logging back into a service. Everyone should be using it!
As a developer, autofill is great but we don’t have any control over it. The Credential Management API is designed to help smooth out that process of signing back into a service. It gives you programmatic access to the username and password (not strictly true, you get access to an opaque PasswordCredential object) for the current user on your site. You can save the details, you can retrieve the details.
There are three APIs:
navigator.credentials.requireUserMediation()(effectively a sign-out button that will require the user to provide a user gesture again on the site before another
Eiji on my team created a full document, Streamlining the Sign-in Flow Using Credential Management API, that explains the process and how to implement it.
This API is Chrome only at the moment, which presents an interesting story: How do you integrate this experience across all platforms? It starts with just optimizing your account sign-up and sign-in pages, use the correct autofill fields so that the browser.
current-password are normally good ones to ensure you are helping all browsers do the right thing when it comes to understanding your user’s data effectively. Once you have a good set-up for your forms, it is pretty easy to detect if the API exists, if there are credentials available for the user and you can then offer a seamless sign-in for the user.
I’ve a vision for the future where we remove product landing pages and sign-in pages altogether, you land on a site and you are using the site or app immediately. I want to get to a web where, if you want, you are signed in to your websites for as long as needed and you don’t have to re-authenticate every other day but if you do that process is as streamlined as possible. I think the Credential Management API is a good step in that direction.
There is also an interesting overlap between this API and the Web Payment Request API, which I think if combined can create a really smooth experience for e-commerce sites.