How to create magic links quickly and effortlessly with NodeJS

Magic links also known as temporary links are links that enable one time action through SMS or email without logging into the actual system through traditional means.

Purpose

  • reset a user’s password
  • one time access to a website or application such as slack or medium
  • actually login into an application without the need of manually inputting your username and password
  • offer discounts in eCommerce systems

There are also SAAS solutions such as Magic.link that add this feature to your application. If you use AuthO, you can have such passwordless authentication.

Why am I implementing?

Consider Bob who is an admin in a MIS, while Alice is a regular user who has forgotten her password.

Bob opens the list of user and click on the reset password feature for Alice. The latter receives a mail with a temporary link valid for only 24 hours.

She opens the link which points to a page related to the MIS. She enters her new password and confirms it. Once done, she is redirected to the login screen. She enters her new credentials and is successfully logged in the system.

How to built the dynamic route?

The idea is to pass a random unique string though this URL using query object such as reset-user-password?t=randomUniqueStringHere. This is what the API shall send in the email as a link. Once Alice opens the link, another API call is done to decode the t query and randomUniqueStringHere value. With ExpressJS, you can easily do this by using req.query.t.

Ways to implement

The persistent means we are going to store some data in the database while the other means, we don’t store any day.

Persistent

The idea is you generate a random unique flow of characters and store in the database with the current date time using libraries such as NodeJS Crypto or UUID. When the user clicks on the link — you have an API request function that will retrieve — the user based on the unique string. You then check if the expire property of the resulting result is within the allocated time, in my example, 24 hours. Once validated, you remove these two fields.

Non Persistent

I retrieve the Front End Url, which is stored as Environment Variables (ENV), concatenate as a query parameter in the url before sending as a link through mail.

Once Alice clicks on the link, her browser opens it. In this route, there is another API request to decode the link passed. If invalid, for instance, there is no query parameter, it returns an error. Otherwise, if the token is still valid and not yet expired, the id of the user is returned to the front. When Alice changes her password, the application passes the id and the new password to the API which resets it successfully.

She is then redirected to the login page where she can put her new credentials.

References

Originally published at http://abdallahyashir.com on May 1, 2020.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store