Firebase Web多角色认证咨询：实现角色注册及登录后跳转指定页面

Hey there! Since you already have basic single-role auth up and running, expanding to support three roles (regular user, premium user, admin) with role-based login redirects is totally manageable—let's walk through the key steps you need to take:

1. Update Your User Model/Database Table #

First, you need to add a role field to your user storage to track each user's type. This should be a constrained field (like an enum or predefined string) to avoid invalid role values.

Example SQL Alter Statement: #

ALTER TABLE users 
ADD COLUMN role VARCHAR(20) NOT NULL DEFAULT 'user' 
CHECK (role IN ('user', 'premium', 'admin'));

Example ORM Model (Django): #

from django.db import models

class CustomUser(models.Model):
    # Existing fields: username, password, email, etc.
    ROLE_OPTIONS = [
        ('user', '普通用户'),
        ('premium', '高级用户'),
        ('admin', '管理员'),
    ]
    role = models.CharField(
        max_length=20,
        choices=ROLE_OPTIONS,
        default='user'
    )

2. Adjust Registration Flow for Role Assignment #

How you handle role selection depends on your use case:

• Open self-registration: Add a role dropdown to your registration form (hide the admin option from regular users—only let super admins create admin accounts via a backend panel).
• Admin-controlled roles: Keep registration limited to user by default, and let admins update roles via a dashboard later.

Example Frontend Registration Form Snippet: #

<form action="/register" method="POST">
  <!-- Username, password, email fields here -->
  <div class="form-group">
    <label for="role">用户角色:</label>
    <select name="role" id="role">
      <option value="user" selected>普通用户</option>
      <option value="premium">高级用户（需付费）</option>
      <!-- Admin option omitted here—only accessible via backend -->
    </select>
  </div>
  <button type="submit">完成注册</button>
</form>

On the backend, save the selected role alongside the other user data when processing the registration request.

3. Modify Login Logic for Role-Based Redirects #

Once you validate the user's credentials, fetch their role from the database and redirect them to their respective landing page.

Example Backend Login Handler (Node.js/Express): #

app.post('/login', async (req, res) => {
  const { username, password } = req.body;
  
  // 1. Validate user credentials
  const user = await User.findOne({ username });
  if (!user || !await bcrypt.compare(password, user.password)) {
    return res.status(401).send('用户名或密码错误');
  }

  // 2. Store user data (including role) in session/JWT for future auth checks
  req.session.user = { id: user._id, username: user.username, role: user.role };

  // 3. Redirect based on role
  switch(user.role) {
    case 'admin':
      return res.redirect('/admin/dashboard');
    case 'premium':
      return res.redirect('/premium/overview');
    case 'user':
    default:
      return res.redirect('/user/home');
  }
});

4. Add Role-Based Access Control (Optional but Critical) #

Don't stop at redirects—make sure users can't manually navigate to pages they don't have permission for. Add a middleware to validate roles before accessing protected routes.

Example Role Validation Middleware (Node.js): #

// Middleware to restrict access to admin-only routes
function requireAdmin(req, res, next) {
  if (req.session.user?.role !== 'admin') {
    return res.redirect('/user/home'); // Or return a 403 Forbidden error
  }
  next();
}

// Apply middleware to admin routes
app.get('/admin/dashboard', requireAdmin, (req, res) => {
  res.render('admin-dashboard');
});

Quick Recap of Key Steps #

• Add a constrained role field to your user model
• Handle role assignment during registration (limit admin roles to backend only)
• Modify login logic to redirect based on the user's role
• Add role validation middleware to prevent unauthorized access to protected pages

内容的提问来源于stack exchange，提问作者Allen GT