Go Passwordless with Stytch’s Email Magic Links

Avatar

This is a guest post written by Brandon Huang and Cal Rueb, partnerships and developer relations at Stytch.

This is likely a familiar experience: you’ve just downloaded a new app on your phone and are eager to get going, but you’re hit with a clunky sign-up flow with a slew of arbitrary password requirements—and you just don’t have the mental energy. Do you reuse a memorized password, or do you diligently pull up your password manager to generate a new one instead? Do you quit the app and decide to do this another day? In any case, passwords have become a source of friction in life that we’ve come to accept, but a passwordless world that is both more seamless and secure is possible.

What is passwordless authentication?

You’ve likely already encountered passwordless authentication without realizing it. Whether it’s logging in with Face ID, an SMS passcode, or your Google account, many applications are already adopting more user-friendly login flows that don’t require passwords. In fact, passwords are more a vestige of the early internet than a true necessity. For example, the fact that the typical password reset flow isn’t password-based suggests that the password wasn’t truly needed to begin with.

Why passwordless?

  • It’s safer: You no longer carry the liability of having to store user passwords on your servers. Even if you never experience a breach yourself, a majority of users reuse their passwords across applications, so all it takes is a breach happening elsewhere to compromise a user’s account on your platform.
  • It’s a better UX: Users no longer have to flip through post-it notes or password managers, which ultimately means higher conversion and retention rates across the board. In one example, Stytch’s passwordless authentication was able to lift conversion by 62%. This can have meaningful business implications for your bottom line.
  • It’s flexible: Passwordless isn’t one-size-fits-all and can be tailored to your particular use case and context. Is your user just logging in to a dashboard? Then an email magic link could suffice. Is your user looking to make a payment or update sensitive information? Then you may want to employ stronger authentication like biometrics or an authenticator app.

Stytch is an all-in-one authentication platform for developers, with solutions ranging from SMS passcodes, email magic links, and OAuth to Web3 logins, biometrics, session management, and now, traditional passwords as well.

Although you could certainly build your own passwordless flows, DIY authentication can be both time-consuming and complex to manage. Using an API like Stytch, you can offload the messier authentication work while focusing on building a truly great product for your customers and users. Below, we go over how you can get started on Stytch using the Stytch API v1 Postman Collection.

One popular passwordless authentication method is email magic links. With email magic links, your users only use their email address to log in. After the user inputs an email address, your application sends the user an email. If the user opens the email and clicks the included magic link, they’ll have proven ownership of that email address and you can safely log them in.

Let’s use the Stytch Postman Collection to replicate this flow.

1. Go to the Stytch public workspace. Follow the instructions there for setting up the workspace, which include:

Instructions for getting set up with Stytch’s Postman Collection
Instructions for getting set up with Stytch’s Postman Collection

2. Next, we need to add redirect URLs in your Stytch dashboard. When a user clicks a magic link, Stytch needs to know where to send them, so we define redirect URLs to do this safely. Go to “https://stytch.com/dashboard/redirect-urls” and add “http://localhost:3000” with the Type “All.”

3. Return to Postman and navigate to the Login Or Create User request under Stytch API v1 > Magic Links > Via email:

4. In the request body, update the email field to your email address. You should use the email address you used to sign up for Stytch in step 1. Leave the rest of the fields as is.

5. Press Send and confirm you receive a 200 response.

6. Go to your email and find the login request sent by Stytch.

7. Click the Log in button. You should be taken to http:localhost:3000, which will appear as a blank page assuming you do not have an application running locally on that port. In the URL you will notice additional query parameters stytch_token_type and token, which is a long random string. Copy the token to your clipboard.

8. Return to Postman and navigate to the Authenticate request under Stytch API v1 > Magic Links.

9. In the request body, replace the token value with the token from your magic link which should be in your clipboard.

10. Press Send and confirm you receive a 200 response. You have now proven ownership of the email which received the magic link and have completed magic link authentication!

 

This blog post just covers authentication via email magic links, but Stytch offers many more authentication methods to fit a wide range of use cases. Be sure to check out our Postman Collection and Stytch.com for more!

What do you think about this topic? Tell us in a comment below.

Comment

Your email address will not be published. Required fields are marked *


This site uses Akismet to reduce spam. Learn how your comment data is processed.