How to create Middleware with Express.js

In this article, we will learn about Middleware methods in the Express.JS framework and how to apply them in our code

The Basic Idea: What's Middleware?

In layman terms, a web server is a function that inputs a request and outputs a response. Here, middlewares are functions executed in the middle after the incoming request, which then produces an output. This output could either be

• the final output, or
• used by the next middleware until the cycle is completed.

This in turn, means that we can have more than one middleware function and they will be executed in the order they are declared(chain-like order)

Since they are executed in a chain-like order, we can represent this diagrammatically like so:

As they are part of express framework, they have access to the request object(req )and response object(res ), and the next function in the application response cycle. For more insight about handling requests in Express, click here.

The next function is a function in the Express which, when invoked, executes the middleware succeeding the current middleware. In short words, this means that the next function will execute the next middleware in the list.

Furthermore, bear in mind that an Express application is essentially a series of middleware calls.

Basic Declaration of Middleware

To declare a middleware function,

const MiddleWareFunction1 = function(req,res,next)=> {
//code to be executed , main logic located here, then 
next()
})

Note:Notice the call to next() . Here, this function invokes the next middleware function in the app.This function must be called, otherwise, the request will be left hanging. The next() function is not a part of the Node.JS or Express API, but is the third argument that is passed to the middleware function. You can name this function whatever you want, but by convention it is always named next .

Using Middleware

To use it, we will use the function called:

app.use(middlewareFunction)

As Express uses middleware in routing methods, we can even use it like so

app.use(route, middlewareFunction)

This means that middlewareFunction() will be called if user navigates to route path.

Chain Like order

As discussed in the starting, if middlewareA is called first, then it will execute first, after that the next middleware functions in the line will execute.

We can write this in code form like so:

app.use(middlewareFunctionA) //Will run first
app.use(middlewareFunctionB) //Will run second
app.use(middlewareFunctionC) //Will run second in line.

Examples

1. MyLogger

Here, we will print the words ‘LOGGED’ whenever a request is passed through the app.

To run it, go to terminal, type : node middleware-basic and then on another terminal , type: curl localhost:3000 . This might be the output:

On client side

On the server side:

2. requestTime function

Remember when I said that middleware functions have access to req and res objects? We can add properties to these objects and then pass them on to next middleware like so:

Here is a simple example to show date and time of when a request is sent:

var requestTime= function((req,res,next)=>{
req.responseTime = Date.now() //add responseTime property to req
next()
})

To use this function, write the code:

console.log not used to there’s no output in the server side. On the client side(where cURL is used) the output is:

validateAPIKey function

In this function, we will check whether there is an API key present in the URL. If it’s not, then the application will close, otherwise next is called(the app proceeds to next steps).

This way, we can even use middleware to ensure that the URL is correct. This is one common use case of middleware functions.

To run it, perform the node command in first terminal window, then in the second terminal window, use curl like so:

Configurable Middleware

Let’s say your middleware function takes up many lines of code. Thus, you want it to be in another module. You can use module.exports . This also makes your middleware configurable. To learn about module.exports , click here.

An example of this can be:

In a file my-middleware.js

module.exports = function (options) {
  return function (req, res, next) {
    // Implement the middleware function based on the options object
    next()
  }
}

In file main.js

var mw = require('./my-middleware.js')

app.use(mw({ option1: '1', option2: '2' }))

Middleware substacks

You can even load multiple middleware functions within app.use to save more time and make your program look less complex.

You can do it like so :

The output is as follows

Error Handling in Middleware

Unlike normal middleware functions which have three parameters, error handling middleware functions will have four parameters:

function (error, req, res, next) {

 console.log(error) //in case an error has occured.

next()

}

The Express API will search through all of our middleware functions. If it finds a middleware with four parameters and not three. It will denote the middleware as an error-handling middleware i.e it will give you access to any error thrown by any of the middleware before it.

Using External Middleware

There are other types of middleware that are built by the programming community to make your production stage or other stages easier, or do some of the heavy lifting of logic for you. They are called External Middleware, or Third-party Middleware

Body-Parser

One such is body-parser . I’ve used it in my previous tutorial. It parses the request body to json,url encoded and others. To use it, you need to install it first:

npm install body-parser

Here’s an example to parse json data

first run node command on one window, then on another window, use curl . The output is as follows

Note: -H denotes that we have to specify the header. This is important otherwise req.body will return an empty body i.e {} . Therefore, denoting a header is very crucial.

Notice how the JSON data has been parsed by body-parser

Another example of external middleware is morgan, which is used for giving concise logs about your HTTP request.

A Recap Of What We’ve Learnt So Far

• To declare middleware:

const myMiddleware = function(req,res,next)=>{
// main logic code here
next() //absolutely necessary
})

• To use it

app.use(myMiddleware)

• Chain like order can be expressed in code in this way:

app.use(middlewareFunction1) //will run first
app.use(middlewareFunction2) //will run second
app.use(middlewareFunction3) //will run third

Glossary

invoke- Whenever a function is called, this means that the function has been invoked.

External Resources

• Writing Middleware
• Using Express Middleware
• Express Third Party Middleware
• ExpressJS — What the Heck Is Middleware?
• ExpressJS- Middleware-TutorialsPoint

That’s all for today. Thank you so much for making it to the end!I hope you’ve learnt a lot in this article. Have a great day!

Stay home, stay safe.

A note from JavaScript In Plain English

We have launched three new publications! Show some love for our new publications by following them: AI in Plain English, UX in Plain English, Python in Plain English — thank you and keep learning!

We are also always interested in helping to promote quality content. If you have an article that you would like to submit to any of our publications, send us an email at [email protected] with your Medium username and we will get you added as a writer. Also let us know which publication/s you want to be added to.