MEAN栈中基于JWT实现currentUser查询GET API的需求

要实现跨机器调用，核心是把原来前端依赖localStorage的解码逻辑迁移到后端——毕竟前端直接解码JWT是不安全的，后端必须验证token的有效性后，才能返回可信的用户信息。下面是具体的实现步骤：

1. 后端创建GET API端点 #

假设你用的是Node.js + Express（其他后端框架逻辑类似），先完成以下操作：

安装依赖 #

npm install jsonwebtoken cors

编写控制器逻辑 #

const jwt = require('jsonwebtoken');
// 从环境变量读取JWT密钥，绝对不要硬编码！
const JWT_SECRET = process.env.JWT_SECRET;

// GET /api/auth/current-user
exports.getCurrentUser = (req, res) => {
  // 从请求头提取Bearer格式的token
  const authHeader = req.headers.authorization;
  if (!authHeader || !authHeader.startsWith('Bearer ')) {
    return res.status(401).json({ error: '未提供有效的认证令牌' });
  }

  const token = authHeader.split(' ')[1];
  try {
    // 验证token签名并解码
    const decodedToken = jwt.verify(token, JWT_SECRET);
    // 返回安全的用户信息（不要包含密码等敏感数据）
    res.status(200).json({
      _id: decodedToken.user._id,
      username: decodedToken.user.username,
      role: decodedToken.user.role,
      email: decodedToken.user.email
    });
  } catch (error) {
    // 分场景处理错误
    if (error.name === 'JsonWebTokenError') {
      return res.status(401).json({ error: '无效的认证令牌' });
    }
    if (error.name === 'TokenExpiredError') {
      return res.status(401).json({ error: '认证令牌已过期' });
    }
    res.status(500).json({ error: '服务器内部错误' });
  }
};

配置路由 #

const express = require('express');
const router = express.Router();
const authController = require('./auth.controller');

// 挂载接口路由
router.get('/auth/current-user', authController.getCurrentUser);

module.exports = router;

配置跨域（CORS） #

如果前端和后端不在同一域名下，必须配置CORS允许前端访问：

const cors = require('cors');
const app = express();

// 生产环境建议指定具体前端域名，不要用*
app.use(cors({
  origin: 'http://your-frontend-domain.com',
  credentials: true // 若需传递Cookie可开启，JWT用Header的话可忽略
}));

// 挂载路由到根路径
app.use('/api', router);

2. 前端修改调用逻辑 #

原来的currentUser是同步读取localStorage解码，现在要改成异步调用后端API：

修改token-service.service.ts #

import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';

@Injectable({ providedIn: 'root' })
export class TokenService {
  constructor(private http: HttpClient) {}

  // 改为异步API调用
  currentUser(): Observable<{ _id: string; username: string; role: string; email: string }> {
    const token = this.authToken();
    if (!token) {
      throw new Error('未找到认证令牌');
    }
    return this.http.get<{ _id: string; username: string; role: string; email: string }>(
      '/api/auth/current-user',
      {
        headers: {
          Authorization: `Bearer ${token}`
        }
      }
    );
  }

  // 其他方法保持不变
  authToken() { return localStorage.getItem('token'); }
  setToken(token: string) { localStorage.setItem('token', token); }
  clearToken() { localStorage.removeItem('token'); }
}

修改auth.service.ts #

因为currentUser现在是异步的，要改成返回Observable：

import { Injectable } from '@angular/core';
import { TokenService } from './token-service.service';
import { Observable } from 'rxjs';

@Injectable({ providedIn: 'root' })
export class AuthService {
  constructor(private tokenService: TokenService) {}

  get currentUser(): Observable<{ _id: string; username: string; role: string; email: string }> {
    return this.tokenService.currentUser();
  }

  // 同步判断登录状态的逻辑可以保留
  get loggedIn(): boolean { return !!this.tokenService.authToken(); }
}

3. 前端组件调用示例 #

在组件中处理异步逻辑：

import { AuthService } from './auth.service';
import { Component, OnInit } from '@angular/core';

@Component({ selector: 'app-profile', template: '<div *ngIf="user">{{user.username}}</div>' })
export class ProfileComponent implements OnInit {
  user: { _id: string; username: string; role: string; email: string } | null = null;

  constructor(private authService: AuthService) {}

  ngOnInit() {
    this.authService.currentUser.subscribe({
      next: (user) => this.user = user,
      error: (err) => {
        console.error(err);
        // 处理错误，比如跳转到登录页
        // this.router.navigate(['/login']);
      }
    });
  }
}

关键注意事项 #

• 不要信任前端解码的JWT：原来前端直接解码token的做法不安全，token可能被篡改，只有后端验证签名后返回的用户信息才可信。
• 环境变量管理：JWT密钥一定要存在环境变量中，绝对不能硬编码到代码里。
• 错误处理：前端要处理API返回的401（未授权、token无效/过期）等错误，及时引导用户重新登录。
• 敏感数据过滤：后端返回用户信息时，不要包含密码哈希、手机号等敏感内容，只返回业务必需的字段。

内容的提问来源于stack exchange，提问作者Sidhu Tesingu