Angular+NodeJS双Web应用单点登录实现方案咨询

针对两个Angular+NodeJS架构的独立Web应用，要实现登录一次即可互通访问，核心是搭建集中式身份认证体系，以下是具体落地步骤：

一、核心架构：统一身份认证中心 #

废弃两个应用各自的登录模块，搭建独立的NodeJS身份认证服务（Auth Server），作为唯一的身份校验入口。所有用户登录、凭证发放、验证逻辑都由该中心处理，两个应用仅负责业务逻辑和凭证校验。

二、分步实现细节 #

1. 身份认证中心（NodeJS）改造 #

• 合并两个应用的用户数据到统一数据库（或做实时数据同步），统一管理用户账号信息
• 采用JWT令牌作为身份凭证：
  • 用非对称加密算法（如RS256）签名，认证中心存私钥，两个应用后端存公钥用于本地校验
  • 令牌中需包含iss（签发者，即认证中心域名）、aud（受众，两个应用的域名列表）、exp（过期时间，建议设15-30分钟）等字段
• 提供两个核心接口：
  • 登录接口：校验用户账号密码，签发JWT访问令牌和HttpOnly刷新令牌
  • 令牌验证/刷新接口：校验令牌合法性，或用刷新令牌换取新的访问令牌

2. Angular前端改造 #

• 移除原有登录页面，所有未登录请求统一跳转到认证中心的登录页
• 登录成功后，认证中心通过预配置的回调地址将JWT访问令牌返回给当前应用，前端将访问令牌存在sessionStorage（避免跨标签页干扰）；刷新令牌由认证中心存入父域名的HttpOnly Cookie（如两个应用域名是app1.example.com和app2.example.com，Cookie的domain设为example.com，path=/，确保两个子域名应用都能读取）
• 实现全局路由守卫：拦截所有需要鉴权的路由，检查本地是否有有效访问令牌，无则跳转至认证中心登录
• 监听令牌过期事件：在访问令牌即将过期时，自动调用认证中心的刷新接口获取新令牌，实现无感续期

3. NodeJS业务后端改造 #

• 移除原有登录校验逻辑，所有需要鉴权的接口，先通过公钥本地校验JWT的签名、iss、aud、exp等字段，或调用认证中心的验证接口校验
• 配置CORS：允许两个应用的域名跨域访问，同时开启credentials: true以支持携带Cookie

4. 关键安全与体验优化 #

• 登出同步：用户在任一应用登出时，需调用认证中心接口失效刷新令牌，同时前端发送广播事件（如通过localStorage监听），通知另一个应用清除本地令牌并跳转至登录页
• 安全防护：
  • Cookie设置HttpOnly、Secure、SameSite=Strict，防范XSS和CSRF攻击
  • 全链路启用HTTPS，避免凭证明文传输
  • 限制JWT的受众范围，防止令牌被其他非法应用使用

三、扩展性方案：基于OAuth2.0/OpenID Connect #

如果后续有接入更多应用的需求，可直接采用OAuth2.0授权码模式+OpenID Connect标准实现：

• 认证中心作为授权服务器（AS）和身份提供商（IdP）
• 两个业务应用作为OAuth2.0客户端，配置Client ID和Client Secret
• 遵循标准流程完成授权、令牌获取、身份信息解析，这种方案兼容性更强，符合行业规范

内容的提问来源于stack exchange，提问作者Lokesh T