Total.js V5: Middlewares

Middlewares are useful features in Web development that helps manage what happens when a user makes a request to your server. It acts like a checkpoint, where you can inspect the request, modify it, or stop it if needed, before it reaches the main logic (controller or module).

In this blog, we’ll focus on how to create simple middleware for handling requests in standard routing. We'll also explore practical examples so you can test it yourself.

1. What is Middleware?

Think of middleware as a gatekeeper that controls access to your routes. For example, before someone can access a secure page, middleware can check if they are logged in. If not, it blocks them with an error message.

Total.js allows you to create middleware for various types of requests:

• Standard (dynamic) routes: Used for API calls or normal page requests.
• Static files: Middleware for files like images, CSS, or JavaScript.
• WebSocket: Middleware for WebSocket connections (real-time messaging).

For now, we’ll focus on middleware for standard routes.

2. How to Create and Use Middleware

Step 1: Create middleware

In Total.js, you can create middleware by using the MIDDLEWARE() function. Here’s a simple example:

MIDDLEWARE('auth', function($, next) {
    if ($.user) {
        next();  // User is logged in, proceed
    } else {
        $.invalid('401', 'Unauthorized');  // Block the request
    }
});

This middleware checks if a user is logged in ($.user). If yes, it lets the request continue using next(). If not, it stops the request and sends a 401 Unauthorized error.

Step 2: Applying middleware to a route

Once you have created middleware, you can apply it to a specific route. For example:

ROUTE('GET /api/users/  *Users --> query  &middleware1 &middleware2 &middleware3');

// or
ROUTE('GET /api/users/ #middleware1 #middleware2', action);

In this example:

The route /api/users/ is protected by the auth middleware.

If a user tries to access it without being logged in, they’ll receive an Unauthorized error.

Organizing Middleware

It’s a good idea to store all your middleware in a separate folder to keep things organized:

mkdir definitions

Then, add your definitions files inside this folder, like auth.js.

Practical example: protecting a route with Bearer Token

In this example, we’ll set up middleware that checks for a specific Bearer token in the headers of a request. If the correct token is provided, the user can access the route. Otherwise, they receive a 401 Unauthorized response.

Step 1: Create Middleware File

Inside the difinitions folder, create a file named auth.js:

MIDDLEWARE('auth', function($, next) {
    const token = $.headers.authorization;

    // Check if the Authorization header contains the correct Bearer token
    if (token && token === 'Bearer mysecrettoken') {
        next();  // Token is valid, proceed to the next step
    } else {
        $.invalid('401');  // Invalid or missing token, block access
    }
}, 'dynamic');

This middleware checks the Authorization header for a Bearer token. In this case, we are expecting the token to be Bearer mysecrettoken.

Step 2: Applying middlewares to routes

Now, in your main file (e.g., index.js), add two routes:

One that requires the correct Bearer token to access.

One that returns a 401 Unauthorized message if the token is missing or incorrect.

exports.install = function() {
    ROUTE('#401', unauthorized);
    ROUTE('GET /api/welcome/  #auth', welcome);
}

function unauthorized($) {  
    $.json({ error: 'Unauthorized access. Please provide a valid Bearer token.' });
}

function welcome($) {  
    $.json({ message: 'Welcome to the secured API!' });
}

Step 3: Testing

Testing with Postman:

Run Your Server: Start your Total.js server.

• node index.js

Set Up the Request in Postman:

Method: GET

URL: http://localhost:8000/api/welcome/

Headers:

• Key: Authorization

• Value: Bearer mysecrettoken

Send the Request: If you provide the correct token (Bearer mysecrettoken), you’ll get the following response:

{
    "message": "Welcome to the secured API!"
}

Without the Token: If you don't include the Authorization header or provide the wrong token, you'll get an error:

{
    "error": "Unauthorized access. Please provide a valid Bearer token."
}

The middleware will block access and redirect the user to the /api/unauthorized/ route, which returns the 401 Unauthorized message.

How the Middleware Works

The middleware looks for the Authorization header in each incoming request.

If the header contains the correct Bearer token ( Bearer mysecrettoken ), the request is allowed to proceed to the next step.

If the token is missing or incorrect, the middleware blocks the request and sends a 401 Unauthorized response.

This approach allows you to secure your API routes easily with a token-based authentication system. You can use this technique to verify users, protect sensitive routes, or manage access control.

Conclusion

Middleware is a simple yet powerful tool in Total.js. By using it, you can control access to your routes, validate requests, and manage other actions before they reach the core of your application. With just a few lines of code, you can secure your app’s routes and prevent unauthorized access.

Now that you understand the basics, try applying middleware to different routes in your project and experiment with more complex logic!