简单实现单点登录

单点登录

单点登录（Single Sign-On, SSO）

• SSO是一种统一身份认证技术，用户只需在认证平台登录一次，即可访问所有关联的应用程序或网站，无需重复输入凭据。例如，企业员工登录内部系统后，可直接进入邮箱、OA等应用，无需二次验证。

SSO 实现方案有很多，一般都需要一个独立的认证中心（passport），子系统的登录均得通过passport，子系统本身将不参与登录操作。如下图

本次实现的单点登录是由其他项目跳到我方项目即可。由于我方项目是后加的，而且工期紧张。要求对原项目改动最小，只加一个菜单就可以跳到本项目，而且两个项目间的token不通用。所以，本项目实现的简单方案是：通过原项目传送对方加密的账号或token，然后我方项目进行解密，生成我方的token。最后存到后端和前端中。

实现步骤：

1. 新建一个普通类和方法。方法里的解密一定要和原项目那边约定好（约定了密钥和过期时间）

   生成token一定要缓存起来。

   // 把authResult 放入缓存，方便后续功能方法可以直接从缓存获取；此时要与表单登录的存储方式一致
   manageUserRepository.create(manageUser, authResult.getTokenId(), ServletUtil.getIpAddr((HttpServletRequest) request));
   

2. 接口要设置为 白名单（无需登录即可访问）
   

3.前端vue，在router里添加单点页面：cosmicSsoLogin，如果获取成功token，将token保存到localStorage，然后重定向到指定页面；
这一步主要是获取token，并将token保存起来；

router.beforeEach( async (to,from,next)=>{   if(to.query?.token) {
     const data = await getCosmicSsoLogin({token:to.query?.token})
    
    saveToken(data.data.token)
    console.log('getItem:',localStorage.getItem('token'))
    next()   
  }else {
    next()   
  } 
})

4.配置接口

5.具体url：

6.前端也要配置白名单，否则访问不了后端

至此，所有代码就都写好了。简单的单点登录功能就实现了。

其实，后端还有一种实现方式，就是使用过滤器。方法如下：

1.新建一个普通的过滤器类。

2.在过滤器链中加入刚才写好的过滤器。必须要在登录之前。

其他，白名单啥的也要配置。前端再调整下路径啥的，即可。

以下圈起来的是重要代码

如果不加，就会报错。404

最后，因为两边的数据如果不是用的一个库下的表（比如用户、权限等），记得同步数据。同步代码略