[IBM LoopBack 101] A Small ToDoList API with MongoDB — Adding Authentication

As a Distributed Systems 2020–21 Class project and a continuation to the [IBM LoopBack 101] A Small ToDoList API with MongoDB article, in this one we will add a authentication feature into the a developed API.

So to continue, as in the previously article, having the Visual Studio Code and MongoDB installed on a Windows 7 machine, we will open the project in the VSCode and on a new terminal, as Command Prompt, navigate in the terminal into the project folder (small-to-do-list-api) and execute the following code to install the @loopback/authentication-jw extension.

Now let’s add some new code into some files that already exist in the project folder.

[Adding JWT Component in the Application ]

In the src/application.ts file, we will bind the authentication components into the class. In the top of the content, add the following imports:

And, add the following import right after the import path line:

Now, in the same file, at the end of the constructor, add the following lines:

[ Creating a User Controller for the login ]

To create a user.controller.ts file, execute the following command and fill the asked fields. You can see the bellow picture for more details.

In the new created file, src/controllers/user.controller.ts, add the following code to implement all the three end points:

[ Protecting the early created EndPoints of the TodoController]

In the src/controllers/todo.controller.ts file, at the top of the content, add the following line:

Then, add the @authenticate decorator line at the class level, like:

And finally let’s start the application with the following command and in any browser go to localhost:3000/explorer.

[ Testing It ]

As showed in the previously article, [IBM LoopBack 101] A Small ToDoList API with MongoDB, we could access/use the endpoints, like making a POST /todos to create a new entry in the MongoDB database, or making a GET /todos to see the already information added in the database, etc…

But now, if we try to use any of the endpoints of the TodoController, we will get a server response like:

So, let’s signup into the API going into UserController/POST/singup of the API with some data (at the minimum, a email and password). Try it out, and in a blank request body of the POST, insert the following content and execute:

Now, at the POST users/login, let’s log in using the previously information used as demonstrated in the following picture:

As we can see, a token was generated.

Copy it, and at the top of the page, click the Authorize button and paste into the value field.

Confirm the action by clicking the Authorize button.

At this point we a logged into the API as we previously have sign in into it.

Now we have access and we can use the endpoints of the TodoController to POST a new entry into the MongoDB, or GET data already put it on it.

Hope you liked this small article, best regards, Ricardo Costa (Richards).

This article was created in a context of the Distributed Systems Class 2020–21, ESTG-IPG.