DEV Community

Cover image for Strapi’s User Roles and Permissions for Admin Panel
Strapi for Strapi

Posted on • Originally published at strapi.io

Strapi’s User Roles and Permissions for Admin Panel

Learn how user management works in Strapi and how to implement it.

Author: Ekekenta Odionyenfe

User management in software development is an essential factor in cybersecurity. In the wave of growing cybercrimes, how do you ensure Authorization and Authentication are done correctly? Improper Authorization and Authentication are why your software is vulnerable.

If you care about your user's safety and data compliance regulations, securing and managing user access should be your utmost concern. This is no different for an application built with Strapi. Security consciousness is an essential topic in software industries. For these reasons, Strapi allows you to manage the Authentication of End-users using Users and Permission Plugins and initiate Role-Based Access Control (RBAC) for admin users in the admin panel.

Prerequisites

You need the following to understand user management in Strapi.

Goals

The goal of this article is to explain how user management works and how to implement user management. The target audience will understand how user management in Strapi is in accordance with data compliance regulations.

This article will briefly explore user management in Strapi, how user management for end-users and admin users works in Strapi, Local Authentication, and Providers’ use for End users Authentication with Strapi.

End Users Versus Admin Users

Although Authentication and Authorization are both security processes in Identity and Access Management (IAM), they're different. While Authentication tries to identify users to make sure they're who they say they are, Authorization allows users to access specific resources/documents based on their Role (who they are).

Think of Authentication as when you try to login into your Facebook account. If you don't provide the correct login credentials (email and password), you won't be allowed access to your account even though it's yours. You'll only be allowed access to your account (authenticated) when you provide the correct login information. The system wants to be sure you're who you say you are.

For Authorization, think of owning a Facebook page. When you ln the Facebook page , you are an admin since you own the page. Hence, you can post content on your page, modify content and even approve content from members of your page that are not administrators. When members of your group who are not administrators try to approve other people's content, they'll find out they can't. This is because they don't have the right to do that; only admins can.

End users in Strapi are like users who login into their Facebook accounts. They're managed with the User and Permissions Plugin and are not admins. At the same time, admin users are like owners of a Facebook page. They're admins and are managed within the admin panel.

The Administration Panel Versus User and Permission Plugin

While the User and Permissions Plugin offer user management just like the admin panel, it is essential to know that these two offer user management for different user types. The administration panel allows you to implement Role-based Access Control for users who have access to the admin panel. In contrast, the User and Permissions Plugin will enable you to manage End-users and enforce Authentication.

To understand this better, let's look at an example of a small blogging company. This company has a ton of authors, editors, and a director of customer success. To organize processes in this company, the authors need to access only their posts, while editors should have access to all posts they would be editing. The director of customer success should be able to access and manage all features concerning posts. Hence, authors can be assigned to author role, editors to editor role, and director of customer success to super admin role in the administration panel.

A Screenshot to Explain

The roles in the administration panel by default are Author, Editor, and Super Admin. By default, the user who creates the Strapi application is assigned the Super Admin role. You can edit any Role by clicking on the edit button beside each Role.

However, user management in the User and Permissions Plugin is different. For example, you would want readers of articles in your blog to drop comments after reading articles written by authors. To do this, they'll need to register an account. Here, you may need to set the User and Permissions Plugin to allow users, whether registered or not, to view articles in your blog. Nevertheless, you may not want unregistered (unauthenticated) users to comment unless they register.

Sample

The roles in the User and Permissions Plugin by default are the Public and Authenticated roles. By default, registered users are assigned to the Authenticated Role.

Adding a New User to the Administration Panel

As your blog keeps growing, you'll need to employ more authors and editors. Let's register a new user (author) for our blog in the admin panel.

  • First, navigate to Settings in the navigation panel by the left. Click on Users under the Administration Panel section. You should see the image below.

Sample

  • Next, click on the blue Invite New User button. Fill in the user's details and user's roles. The user can be assigned to more than one Role. However, in this case, we are assigning the user to the Author role. At this point, you will be asked to send a registration token to the user so that they can connect.

A Sample Screenshot

  • Since our sample application is locally hosted, copy the link and paste it into your browser. Next, we'll be directed to this page once the token registration loads.

A Sample Screenshot

  • Fill in the information required and click on the Let's Start button. Notice that the new user dashboard you just registered only has a media library to upload files. The Super Admin can see files uploaded by any user. Also, notice that when you navigate to Settings/Administration panel/roles, i.e., http://localhost:1337/admin/settings/roles, you now have one registered author.

User Management in the Administration Panel Explained

This section will create a sample blog with two authors, two editors, and one super admin. The goal of this sample blog is to understand how user management in the administration panel is done.

  • Like in our last example on adding a new user to the admin panel, add one more author and two editors.
  • Navigate to the tab where one of the authors is logged in and add a media. For me, I'll be adding a Jpeg file for one of my users. To do this, click on Media Library in the navigation tab. Next, click on the Upload assets button, and you'll be prompted to upload an asset.

A Sample Screenshot

When you navigate to the tab where the super admin or editors are logged in and navigate to p*lugins/media library*, i.e., http://localhost:1337/admin/plugins/upload, you should see the file you just uploaded. However, only the author who uploaded the file can see it; the other author can't assess it.

Just like a conventional blog, editors can replace media posted by an author. When you customize roles in the admin panel, you can give permissions to editors to access only posts by authors assigned to them.

Also, you can create new collection types for your articles and assign roles to users that can assign them.

Updating and Adding New Roles in the Administration Panel

You can update the permissions of each Role as well as add new roles. We have only three Roles by default. However, we can decide to add more Roles to the admin panel.

For example, in our sample blog application, we may require an editor-in-chief. He isn't limited to access only posts that he is assigned to edit, but he can access all Posts on the board. To add a new role for our editor-in-chief:

  1. Navigate to Settings/Administration Panel/Roles, i.e., [http://localhost:1337/admin/settings/roles]
  2. Click on the Add new role button.
  3. Fill in the required information, and the new Role you just created will be present in the admin panel.

To update an already existing role, click on the edit button beside the Role. Please search for the function you'll like to update and click on the box to check it.

User Management for End Users

In this section, we will explore the different states of an end-user. From Public Role to Authenticated Role, and how to manage permissions for end users.

Public Role

Public Role is the default role associated with every request that doesn't have an authorization header. If you allow some permissions in this Role, everybody will be able to access the routes or endpoint you selected.

Authenticated Role

Every new user that logs in (authenticated) is given this Role by default if you don't provide a role for them at creation. In this Role, you can define routes that authenticated users can access.

Permission’s Management

To manage or modify permissions of user roles, click on the role name in the dashboard. This will enable you to view all functions related to a specific route available in your application. Check or uncheck a function name to permit the current Role you're editing.

Most times, new users are not given roles. To update the default role and assign a new Role to the user, navigate to the Advanced settings tab and update the Default role for authenticated users option. Please search for the user and update their Role.

Local Authentication for End Users

For Strapi end users, authentication can either be done locally or with the use of providers. In this section, we will explore what local authentication in Strapi is. Local authentication involves authentication locally on Strapi with your login credentials. Here, we will discuss how registration and authentication can be done locally on Strapi.

Registration

Registration in Strapi's admin panel is pretty straightforward. When this plugin is installed, you can register users with Axios by posting their data into your database, as seen in the example below.

    //import axios
    import axios from 'axios';

    // Add your own code here to customize or restrict how the public can register new users.

    // make post request with user's credential
    axios
      .post('http://localhost:1337/auth/local/register', {
        username: 'username',
        email: 'email',
        password: 'password',
      })
      .then(response => {
        // If user was registered successfully .....
        console.log('Well done!');
        console.log('User profile', response.data.user);
        console.log('User token', response.data.jwt);
      })
      .catch(error => {
        // If there was an error .......
        console.log('An error occurred:', error.response);
      });
Enter fullscreen mode Exit fullscreen mode

The identifier in the API call can either be the user’s email or username.

Token Usage

When you want to limit which user can access some routes or documents based on their Role, you can use JWT tokens and place JSON web tokens in the authorization header of your API request for restricted permission requests.

If you don't place an authorization header in your API requests, then the request will assume the public role permission by default. Below is an example of an API request with an authorization header.

    //import axios
    import axios from 'axios';

    // place your token here or you can use a .env file.
    const token = 'YOUR_TOKEN_HERE';

    // make post request.
    axios
      .get('http://localhost:1337/posts', {
    // place authorization header here
        headers: {
          Authorization: `Bearer ${token}`,
        },
      })
      .then(response => {
        // If user was registered successfully .....
        console.log('Data: ', response.data);
      })
      .catch(error => {
        // If there was an error .......
        console.log('An error occurred:', error.response);
      });
Enter fullscreen mode Exit fullscreen mode

The example above places an authorization header in the API request to retrieve posts. Remember that when a user is successfully authenticated, the user token will be sent as seen in our login example console.log('User token', response.data.jwt);.

If the user's token doesn't correspond to the token required during authorization, an error will occur, and error code 401 (unauthorized) will be displayed.

Email Validation

To avoid spamming, you may want to send an email to registered users to validate their registration. To do this, set Enable email confirmation to ON in the admin dashboard. Make sure that the URL config property is set so that users can receive the confirmation link. Sometimes, there's a need to re-send confirmation mail to users. To do this, make a request like the example below.

    // import axios
    import axios from 'axios';

    // Send validation email
    axios
      .post(`http://localhost:1337/auth/send-email-confirmation`, {
        email: 'user@strapi.io', // user's email
      })
      .then(response => {
        // If user was registered successfully .....
        console.log('Your user received an email');
      })
      .catch(error => {
      // If there was an error .......
        console.error('An error occurred:', error.response);
      });
Enter fullscreen mode Exit fullscreen mode

The Use of Providers for End Users Authentication

For most users, it becomes more stressful to create new profiles for each software they're about to use. To solve this issue, Strapi allows users to sign in with the help of providers. For instance, you can be able to sign in to your Strapi account with GitHub. You can implement this feature with your application built with Strapi so that your users can use providers like Facebook or Google to log into their application.

A Sample Screenshot

The diagram above explains how providers communicate with your application whenever a user logs in or registers with them. It is important to note that users who log into their accounts have the authenticated Role assigned to them by default if you haven't assigned a role to them yet, regardless of whether they use providers or the local method.

Strapi allows users to log in or register with the following providers:

  • GitHub
  • Facebook
  • Google
  • AWS Cognito
  • Twitter
  • Discord
  • Twitch
  • Instagram
  • VK
  • Linkedin
  • Reddit
  • Auth0

A detailed explanation of how to incorporate each provider in your application is shown in this documentation.

Conclusion

This article explains how user management in Strapi is done. We have explored role-based access control and how it relates to the administration panel. Also, we discussed authentication using the user and permission plugin both locally and with the use of providers.

First, we discussed the distinct difference between user management in the user and permissions plugin and the administration panel. Next, we set up a simple blog to explain user roles and permissions in the administration panel. We also looked into customizing the Roles in the admin panel.

The usefulness of user management cannot be overemphasized. It is essential to understand how this works to optimize your application better. To have access to unlimited roles in the admin panel, try out Strapi's enterprise edition.

Discussion (0)