Introducing, Installing, & Configuring Bouncer

In this lesson, we'll introduce AdonisJS Bouncer, the first-party AdonisJS package for authorization checking. We'll also get a start project setup and install and configure Bouncer.

Published
Dec 18, 21
Duration
7m 2s

Developer, dog lover, and burrito eater. Currently teaching AdonisJS, a fully featured NodeJS framework, and running Adocasts where I post new lessons weekly. Professionally, I work with JavaScript, .Net C#, and SQL Server.

Adocasts

Burlington, KY

For those new to the term, authorization and authentication can be easy to confuse. So, let's first clear up which is which. Authentication deals with logging users in and out, registering new users, determining who a user is, etc. Authorization, on the other hand, deals more with permission checking. Things like, can the user view a page, create a record, and so on.

In this series, we'll be learning AdonisJS' first-party package to handle authorization, called Bouncer. Bouncer allows us to define authorization checks in one place and use those checks anywhere within an HTTP request, including within the Edge template engine.

Prerequisites

Bouncer relies heavily on the AdonisJS Auth package. So, you're going to need to ensure you're application is using the first-party auth package in order to utilize Bouncer. You don't need an authenticated user to use it, it can work with guests, but you do need the auth package.

Starter Project

Since we need a project with authentication up and running already and we need some reason to do some authorization checking, I've created a blog project for us to start from. You can find it on GitHub, called adonisjs-bouncer.

Getting Up & Running

So, if you're looking to follow along, go ahead and clone down the repository.

git clone https://github.com/jagr-co/adonisjs-bouncer
Copied!

Then, change into its directory.

cd adonisjs-bouncer
Copied!

Install its already defined dependencies.

npm i
Copied!

Open the project in your text editor of choice and copy the .env.example file and paste it, renaming it to just .env. Then, update the database connection to match your needs. The project is currently set to use Postgres, so you may need to change that as well, depending on your needs.

To serve as an example here's my complete .env.

# .env

PORT=3333
HOST=0.0.0.0
NODE_ENV=development
APP_KEY=_N6tZMFshID3rH2UIqIcgf0WRV3oMPFL
DRIVE_DISK=local
SESSION_DRIVER=cookie
CACHE_VIEWS=false
DB_CONNECTION=pg
PG_HOST=localhost
PG_PORT=5432
PG_USER=postgres
PG_PASSWORD=password
PG_DB_NAME=adonisjs-blog

Once you've got your .env created and your database variables are defined, jump back into your terminal and let's run the migrations.

node ace migration:run

# ❯ migrated database/migrations/1639232007772_users
# ❯ migrated database/migrations/1639529610746_posts
# ❯ migrated database/migrations/1639529648792_comments

# Migrated in 134 ms
Copied!

Lastly, if you'd like to use Git on this project, go ahead and delete the .git repository and re-initialize Git within the project

# Make sure you're in the project directory!

rm -rf .git
Copied!
git init
Copied!

Current State & Our Authorization Goal

In its current state, it allows users to register, login, and logout. It also currently allows any authenticated user to create a post, edit any post, delete any post, create a comment, and delete any comment.

In addition to this, the application also contains four different roles, which are defined within contracts/enums/Role.ts, user, moderator, editor, and admin. Using bouncer, we'll be authorizing each role to perform certain actions.

  • User

    • View published posts

    • Create comments on posts

    • Delete any comment the user has created

  • Moderator

    • View published posts

    • Create comments on posts

    • Delete any comment, this allows them to moderate the comment section

  • Editor

    • Create comments on posts

    • Delete any comment the user has created

    • Create posts

    • View published posts

    • View unpublished posts the user has created

    • Edit and delete posts the user has created

  • Admin

    • View, create, edit, and delete anything

Starting in the next lesson, we'll learn about Bouncer actions and how we can use them to take our blog from the free-range, anything-goes badlands, to the orderly blog our roles are there to enforce. Before we can do that though, we need to get Bouncer installed and configured within our application.

Install & Configure

The first step here is to get Bouncer installed and configured within your project. So first let's install it.

npm i @adonisjs/bouncer
Copied!

Then, configure it within your project. This is going to create the main file our actions will be defined within, start/bouncer.ts. It's also going to configure the Bouncer provider, add in a Bouncer specific Ace CLI command, and a few other things.

node ace configure @adonisjs/bouncer

# CREATE: start/bouncer.ts
# CREATE: contracts/bouncer.ts
# UPDATE: tsconfig.json { types += "@adonisjs/bouncer" }
# UPDATE: .adonisrc.json { commands += "@adonisjs/bouncer/build/commands" }
# UPDATE: .adonisrc.json { providers += "@adonisjs/bouncer" }
# UPDATE: .adonisrc.json { preloads += "./start/bouncer" }
# CREATE: ace-manifest.json file
Copied!

With that, we now have Bouncer successfully installed and configured.

Bouncer Starter File

Before we dive into using Bouncer in the next lesson, let's first digest the start/bouncer.ts file that was created when we configured Bouncer into our project. This file contains a lot of useful comments to help introduce you to Bouncer, so definitely give them a read-through! For brevity, I'll be cutting them out and focusing specifically on the code.

So, this file contains three main lines. First, we import the Bouncer module from @ioc:Adonis/Addons/Bouncer. If you're here learning about authorization, nothing should feel foreign yet.

import Bouncer from '@ioc:Adonis/Addons/Bouncer'
Copied!

Next, a constant called actions is being extracted out of the Bouncer module and exported.

export const { actions } = Bouncer
Copied!

We'll be learning about actions in the next lesson, but it's here that we'll be defining our actions. You're always going to want to ensure you're exporting this actions variable from this bouncer file!

Lastly, we have another constant, called policies, that's also being extracted out of the Bouncer module and exported.

export const { policies } = Bouncer.registerPolicies({})
Copied!

Two lessons from now, we'll cover policies and we'll use this section to register the policies we create. Same with actions, you're also always going to want to ensure you're exporting the policies variable from this bouncer file as well.

Next Up

Now that we have our start application cloned down and set up and we've installed and configured Bouncer within this project, we're now ready to start learning about and adding Bouncer. So, in the next lesson, we'll be specifically focusing on actions to accomplish all the authorization checks we have defined for our roles above.

Join The Discussion! (0 Comments)

Please sign in or sign up for free to join in on the dicussion.

robot comment bubble

Be the first to Comment!