Email (only) Login

The Gallery
1

Hi all,

It’s been altogether too long since I posted a project here. Here’s one I did earlier this year which might be useful to anyone who wants to provide email only login. The main points for this demonstration are:

  • it doesn’t depend on having or storing passwords
  • it doesn’t depend on any external login provider

And as always with my projects, they’re customised and suitable specifically for Glitch.

Project URL: https://glitch.com/~email-auth

The upshot of how it works - for the user - is as follows (see screenshots below too):

  1. enter your email address and you’ll be shown a human readable code (e.g. Whispering Charcoal Antelope)
  2. check your email and if the code matches, click the Verify Email Address link
  3. this opens a new window and confirms
  4. in your original window you’ll be automatically logged in

User code to check

User Email

One lovely thing to note is that you can enter your email address in your browser, but click the confirm link on your phone, and the flow still works. Or the other way around depending on where you login or read your email.

In my original use-case for this kind of login flow I used Redis to store the tokens used but knowing that we have just one server in Glitch then we can store those tokens within the server itself and (again) not having to depend on an external service.

The only external service used is MailGun for sending email.

As another little experiment I’m used LevelDB to store the events as we see them from both the actions of the user, and the webhook events MailGun sends us. It would be pretty straightforward to use SQLite for this too and I’d be happy to create a base project using this too if anyone is interested.

List of Events

If remixing the project you’ll need to set various things in your .env:

# TITLE is used in the main navbar, and if `pageTitle` doesn't exist in the template vars.
TITLE=""
DOMAIN=

# SESSION_KEY is the key used to sign the web session
SESSION_KEY=

# MAILGUN
MAILGUN_DOMAIN=
MAILGUN_API_KEY=
MAILGUN_PUBLIC_KEY=

I’d love any feedback, thoughts, or even better if anyone wants to use this in any of their projects I’d love to see examples of it being used in the wild.

Note: there is a slightly longer story if you want to know how the login flow works from a technical point of view, so feel free to ping me if you’d like to know.

Cheers,
Andy

5 Likes
2

I’m personally a huge fan of email only auth, I also built my own in the pre-glitch days. We eventually plan on adding something like to glitch in the future. This’ll be a nice reference for us, thanks!

1 Like