Route Protection

Route protection with CRA

Route protection means protecting any defined path from unauthorized access. For example, Signin or Signup pages are common paths/unrestricted paths and any user can access it. However there are many paths or pages that only logged in users can access, those paths are called Protected Routes. In Crema, we have provided the functionality of route protection, you have to follow the following steps to protect the route:- Step 1. To hide/show the menu based on the user role, We need to protect the navigation menu as well as routes. To protect the navigation menu go to the src/modules/routesConfig.js file, In this file, we declared all the navigation(route) menu. We want to bind the menu with the auth role of the user. then we assign the role to the route menu.

While defining the route menu, you have to pass one extra property named "auth" in the menu object in order to make the menu protected like below.

Step 2. We need to protect the route from unwanted access. To protect the route from unwanted access, we need to add the 'auth' property, this route will be protected and need particular role access to access it and if this property is not passed, then this path is directly accessible without any condition.

src/modules/dashboard/index.js

While declaring the route, you have to pass one extra property named "auth" in the route object in order to make the route protected.

If this 'auth' property is added, this route will be protected and requires a logged-in user to access this path and fulfill the required role and if this property is not passed, then this path is directly accessible without any condition.