DEV Community

Cover image for Node.js Express Login example with MySQL database
Tien Nguyen
Tien Nguyen

Posted on • Edited on

93 24

Node.js Express Login example with MySQL database

In this tutorial, we're gonna build a Node.js Express Login & Registration example that supports Token Based Authentication with JWT (JSONWebToken). You'll know:

  • Appropriate Flow for User Signup & User Login with JWT Authentication
  • Node.js Express Architecture with CORS, Authenticaton & Authorization middlewares & Sequelize
  • How to configure Express routes to work with JWT
  • How to define Data Models and association for Authentication and Authorization
  • Way to use Sequelize to interact with MySQL Database

Full Article: https://bezkoder.com/node-js-jwt-authentication-mysql/

Token Based Authentication

Comparing with Session-based Authentication that need to store Session on Cookie, the big advantage of Token-based Authentication is that we store the JSON Web Token (JWT) on Client side: Local Storage for Browser, Keychain for IOS and SharedPreferences for Android… So we don’t need to build another backend project that supports Native Apps or an additional Authentication module for Native App users.

Alt Text

There are three important parts of a JWT: Header, Payload, Signature. Together they are combined to a standard structure: header.payload.signature.

The Client typically attaches JWT in Authorization header with Bearer prefix:

Authorization: Bearer [header].[payload].[signature]
Enter fullscreen mode Exit fullscreen mode

Or only in x-access-token header:

x-access-token: [header].[payload].[signature]
Enter fullscreen mode Exit fullscreen mode

For more details, you can visit:
In-depth Introduction to JWT-JSON Web Token

Overview of Node.js Express Login & Registration example

We will build a Node.js Express application in that:

  • User can signup new account, or login with username & password.
  • By User's role (admin, moderator, user), we authorize the User to access resources

This is our Node.js application demo running with MySQL database and test Rest Apis with Postman.

These are APIs that we need to provide:

  • POST /api/auth/signup signup new account
  • POST /api/auth/signin login an account
  • GET /api/test/all retrieve public content
  • GET /api/test/user access User's content
  • GET /api/test/mod access Moderator's content
  • GET /api/test/admin access Admin's content

Flow for Signup & Login with JWT Authentication

The diagram shows flow of User Registration, User Login and Authorization process.

node-js-login-mysql-example-flow

A legal JWT must be added to HTTP x-access-token Header if Client accesses protected resources.

You may need to implement Refresh Token like this:

node-js-express-refresh-token-example-flow

More details at: https://bezkoder.com/jwt-refresh-token-node-js/

Node.js Express Architecture with Authentication & Authorization

You can have an overview of our Node.js Express App with the diagram below:

Alt Text

Via Express routes, HTTP request that matches a route will be checked by CORS Middleware before coming to Security layer.

Security layer includes:

  • JWT Authentication Middleware: verify SignUp, verify token
  • Authorization Middleware: check User's roles with record in database

If these middlewares throw any error, a message will be sent as HTTP response.

Controllers interact with MySQL Database via Sequelize and send HTTP response (token, user information, data based on roles…) to client.

For more details, implementation and Github, please visit:
https://bezkoder.com/node-js-jwt-authentication-mysql/

Using Cookies: https://www.bezkoder.com/node-js-express-login-example/

Front-end that works well with this:

You may need to implement Refresh Token like this:

node-js-express-refresh-token-example-flow

More details at: https://bezkoder.com/jwt-refresh-token-node-js/

Further Reading

Fullstack:

Deployment:

Node.js & MySQL Associations:

Dockerize: Docker Compose: Node.js Express and MySQL example

Tiugo image

Modular, Fast, and Built for Developers

CKEditor 5 gives you full control over your editing experience. A modular architecture means you get high performance, fewer re-renders and a setup that scales with your needs.

Start now

Top comments (2)

Collapse
 
josephdailey11 profile image
JDailey

Good information. Thanks.

Collapse
 
vikashask profile image
vikash verma

Awesome contents..

Neon image

Next.js applications: Set up a Neon project in seconds

If you're starting a new project, Neon has got your databases covered. No credit cards. No trials. No getting in your way.

Get started →

👋 Kindness is contagious

DEV is better (more customized, reading settings like dark mode etc) when you're signed in!

Okay