Authorization
Authorization is the process of verifying that a user has the necessary permissions to access a resource. Learn how to use the pre-configured authorization components and hooks to protect your client-side and server-side routes.
Protecting Client-Side Routes
I have created an easy to use <Authorization />
component that you can use to protect your client-side routes.
The component will check if the user has the necessary permissions to access the route.
If the user doesn't have the necessary permissions, a fallback component will be rendered.
By default, authentication is required to access every client route.
Keep in mind that protecting sensitive resources on the client-side only is not secure. Always ensure that server-side routes are also protected.
RBAC (Role-Based Access Control)
In a role-based system, different user roles (like USER and ADMIN) have different levels of access. Users are given access based on their role. For example, admins can do everything, while regular users have limited access.
Usage
Here's an example of how you can implement RBAC with the <Authorization />
component to protect your client-side routes:
- The
<Authorization />
component will check if the user has the role ofADMIN
. - If the user has the role of
ADMIN
, the<UsersContent />
component will be rendered. - If the user doesn't have the role of
ADMIN
, the<AccessDenied />
component will be rendered.
PBAC (Policy-Based Access Control)
While RBAC provides a structured way to manage authorization, there are times when a more detailed approach is needed. PBAC offers greater flexibility, especially in cases where access permissions require fine-tuning based on specific criteria.
For RBAC protection, you can use the RBAC component by passing allowed roles to it. However, for stricter protection, you can employ policy checks.
The advantage of using policies is the ability to define custom logic to verify if the user has
the necessary permissions to access a resource. For example, the post:delete
policy checks if the user is an admin or the author
of the comment before allowing them to delete it.
Usage
Here's an example of how you can use the <Authorization />
component with policies to protect your client-side routes:
Protecting Server-Side Routes
Protecting server-side routes is crucial to ensure that only authenticated users with the necessary permissions can access sensitive resources.
Read more about how to protect server-side routes easily with tRPC in the API authorization section.
Last updated on