Vue.js + Firebase: Role-Based Authentication & Authorization

Using Auth Claims

In this article, you’re going to learn how to set user roles using Auth Custom Claims and store user data to the Cloud Firestore when a new Firebase user account is created.

Then, I will be showing you how to guard vue routes based on user role when signing in.

Finally, I will teach you how to get all the user accounts at once when the signed-in user has admin privileges and change user roles using Firebase callable function.

Here are the 3 roles:

• The admin role will have access to all the users stored on the database and will be given permission to change user roles using Security Rules.
• The Driver role will have access to Driver View.
• The customer role will have access to Customer View and it will be set as the default role as most of the users will be under this role.

Sounds interesting…let’s get learning!

Up and Running Vue Project