单点登录（SSO）深度解析：Java + Vue 项目实战全景指南

一句话定位：单点登录（SSO）不是“同一个账号登录多个系统”，而是“一次认证，全体系信任”。 在 Java + Vue 前后端分离架构下，它的本质是把“登录”从各个业务系统中抽离出来，交给一个独立的认证中心统一管理，并通过标准化的令牌传递机制，实现跨系统、跨域的身份互认。

一、什么是 SSO？——为什么需要它

1.1 传统登录的三大痛点

在多系统企业中，用户每天可能要切换 OA、CRM、财务等多个系统，每进入一个系统都要重新输入账号密码 。这背后的本质问题是：

1.2 SSO 的解决方案

SSO 通过引入一个独立的认证中心（IdP），将用户的登录态从“各系统分别记住”变成“认证中心统一管理”，让“一次登录，全网通行”成为现实 。

二、SSO 的核心架构与关键角色

2.1 三大核心角色

2.2 核心组件职责拆分

三、SSO 的运行流程

3.1 首次登录：完整认证流程

3.2 访问第二个系统：免登录流程

核心机制：用户浏览器在 IdP 域名下保存了全局会话 Cookie，这是“一次登录、多系统互通”的关键凭证 。

3.3 退出登录

四、SSO 在 Java + Vue 项目中的技术实现全景

4.1 前后端分离架构下的 SSO 设计

在 Java + Vue 前后端分离架构下，SSO 的实现需要额外处理跨域问题。核心思路是：前端统一管理 Token，后端统一校验 Token 。

4.2 前端关键实现

javascript

// Vue 路由守卫：检查登录状态
router.beforeEach(async (to, from, next) => {
const token = localStorage.getItem('sso_token')
if (!token) {
// 重定向到 SSO 认证中心
window.location.href = `${SSO_SERVER_URL}/login?redirect=${encodeURIComponent(window.location.href)}`
return
}
// 验证 token 有效性（调用后端接口）
const isValid = await verifyToken(token)
if (!isValid) {
window.location.href = `${SSO_SERVER_URL}/login?redirect=${encodeURIComponent(window.location.href)}`
return
}
next()
})

// Axios 拦截器：自动携带 Token
axios.interceptors.request.use(config => {
const token = localStorage.getItem('sso_token')
if (token) {
config.headers.Authorization = `Bearer ${token}`
}
return config
})

4.3 后端关键实现

java

// Spring Boot 过滤器：拦截并校验 Token
@Component
public class SsoAuthenticationFilter extends OncePerRequestFilter {
@Override
protected void doFilterInternal(HttpServletRequest request,
HttpServletResponse response,
FilterChain filterChain) {
String token = request.getHeader("Authorization");
if (token == null) {
// 重定向到 SSO 认证中心
response.sendRedirect(ssoServerUrl + "/login");
return;
}
// 向认证中心校验 Token（或本地 JWT 验签）
UserInfo user = ssoClient.verifyToken(token);
if (user == null) {
response.sendRedirect(ssoServerUrl + "/login");
return;
}
// 将用户信息注入当前线程上下文
SecurityContextHolder.getContext().setAuthentication(
new UsernamePasswordAuthenticationToken(user, null, user.getAuthorities())
);
filterChain.doFilter(request, response);
}
}

五、SSO 的主流实现方案对比

5.1 JWT vs OAuth 2.0：关键区别

六、SSO 落地的关键技术要点

6.1 跨域问题处理

在前后端分离架构中，前端和后端可能部署在不同域名下。处理方式 ：

6.2 令牌存储策略

6.3 分布式 Session 管理

在分布式部署场景下，必须解决 Session 共享问题。推荐使用 Redis 作为分布式 Session 存储 ：

java

// 使用 Redis 存储用户会话信息
@Autowired
private RedisTemplate<String, Object> redisTemplate;

public void saveSession(String token, UserInfo user) {
redisTemplate.opsForValue().set(
"sso:session:" + token,
user,
30, TimeUnit.MINUTES
);
}

public UserInfo getSession(String token) {
return (UserInfo) redisTemplate.opsForValue()
.get("sso:session:" + token);
}

七、SSO 实战全景架构图

text

┌─────────────────────────────────────────────────────────────────┐
│ 用户（浏览器） │
└─────────────────────────────┬───────────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────────────────┐
│ 前端层（Vue） │
│ ┌─────────────┐ ┌─────────────┐ ┌─────────────┐ │
│ │ 系统A前端 │ │ 系统B前端 │ │ 系统C前端 │ │
│ │ 路由守卫拦截 │ │ 路由守卫拦截 │ │ 路由守卫拦截 │ │
│ └──────┬──────┘ └──────┬──────┘ └──────┬──────┘ │
└─────────┼────────────────┼────────────────┼───────────────────┘
│ │ │
▼ ▼ ▼
┌─────────────────────────────────────────────────────────────────┐
│ 后端层（Java） │
│ ┌─────────────┐ ┌─────────────┐ ┌─────────────┐ │
│ │ 系统A后端 │ │ 系统B后端 │ │ 系统C后端 │ │
│ │Token校验过滤器│ │Token校验过滤器│ │Token校验过滤器│ │
│ └──────┬──────┘ └──────┬──────┘ └──────┬──────┘ │
└─────────┼────────────────┼────────────────┼───────────────────┘
│ │ │
└────────────────┼────────────────┘
▼
┌─────────────────────────────────────────────────────────────────┐
│ SSO 认证中心（Java） │
│ ┌─────────────┐ ┌─────────────┐ ┌─────────────┐ │
│ │ 登录认证接口 │ │ Token签发 │ │ Token校验 │ │
│ └─────────────┘ └─────────────┘ └─────────────┘ │
└─────────────────────────────┬───────────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────────────────┐
│ Redis（分布式Session存储） │
│ Token → 用户信息 映射存储 / 黑名单管理 │
└─────────────────────────────────────────────────────────────────┘

八、总结

九、按技术栈场景