单点登录SSO——前端要怎么做？

单点登录的概念：在多个关系系统中只登录一次，访问其他系统可以不再输入账号密码，不再登录，自动已登录。

单点登录特点：1、只认证一次 2、多系统共享登录状态 3、不用重复输入账号密码 4、退出一个，所有系统都自动退出。即单点注销。

假如A系统代表自己系统，B系统代表统一认证平台，要求点击A系统登录按钮——进入B系统登录页——登录成功后进入A系统功能页。

一、实现以上需求的整体流程是什么？

• 用户访问 业务系统 A → 没登录
• 前端自动跳转到 统一认证中心
• 认证中心输账号密码 / 验证码登录
• 认证中心生成 令牌 Ticket / Token
• 跳回业务系统 A，带上令牌
• 业务系统后端校验令牌 → 生成自己业务 Token
• 后续访问所有关联系统，都免登录

二、前端应该怎么做实现单点登录

1、跳转至其他系统登录页时，需要加重定向url

let redirect = 'https://你的系统.com/功能页'
location.href = `https://B系统.com/login?redirect=${encodeURIComponent(redirect)}`;

2、B系统登录成功后，会根据redirect跳回A系统功能页面，并携带ticket/授权码

浏览器上会发现：https://你的系统.com/功能页？ticket=‘’

3、前端截取ticket，把ticket传给后端

4、后端校验ticket，有效则返回业务token，前端将token存到本地，以后每次请求都会携带token。

// 1. 拿ticket去SSO校验，获取用户信息
UserInfo user = ssoClient.checkTicket(ticket);

// 2. 根据用户信息 生成 业务系统自己的Token
String businessToken = jwtUtil.generateToken(user.getUserId(), user.getRoles());