前端-sso单点登录方案

定义: 单点登录就是指通过用户的一次性鉴别登陆,其他子项目在需要验证用户信息的时候,无需再做登录操作,自动识别登录。

为什么要选择单点登录:就当一个产品。改产品下有三个子产品,如果每个子产品都重复写一遍登录,那么后期维护的时候,开发人员需要打开三处登录页面代码去修改同样的逻辑,然后可能发生忘记修改到全部逻辑,维护起来还是很累的。

使用案例: 单点登录在大型网站里使用得非常频繁,例如,阿里旗下有淘宝、天猫等网站,还有背后的成百上千的子系统,用户一次操作或交易可能涉及到几十个子系统的协作,如果每个子系统都需要用户认证,不仅用户会疯掉,各子系统也会为这种重复认证授权的逻辑搞疯掉。前端-sso单点登录方案_第1张图片

用户只需要登录一次,就可以访问所有的相互信任的应用软件。

实现方式:单点登录的本质就是在多个应用系统中共享登录状态,所以实现单点登录的关键在于,如何让Token在多个域中共享

1、同域下的单点登录

一个企业一般情况下只有一个域名,通过二级域名区分不同的系统。比如阿里云下有abc 三个子业务系统;

a.aliyun.cn
b.aliyun.cn
c.aliyun.cn

我们要做单点登录,需要做一个登录系统叫,login.aliyun.cn。我们只需要在login.aliyun.cn上登录,其他 a,b,c 系统也登陆;

实现方式: 其实就是利用 二级域名,写一级域名的Cookie,  login.aliyun.cn登录以后,可以将Cookie的域设置为顶域,即.aliyun,这样所有子域的系统都可以访问到顶域的Cookie

这种的实现方式比较简单,但不支持夸主域名,局限于一级域名是一样的情况。

2、不同域下的单点登录

同域下的单点登录是巧用了Cookie顶域的特性,如果是不同域呢,比如:下面三个是不同域的

a.aliyun.cn

b.qq.cn

c.csdn.cn

实现方式我们可以部署一个SSO认证中心,认证中心就是一个专门负责处理登录请求。

前端-sso单点登录方案_第2张图片

 所有的请求(登录、退出、获取用户信息、当前用户状态)都请求sso系统,sso系统维护用户信息。

此种实现方式相对复杂,支持跨域,扩展性好,是单点登录的标准做法。

逻辑分析

输入用户名密码,登陆成功,接口返回token

有token,调取换code的接口。 1、接口如果获取的code值为空,清除本地的cookies,再登录;2、如果code有值,将url中的redirectUrl后拼接接口拿到的code 重定向到想要去的页面。

判断域名: document.domain获取浏览器域名。获取到域名后,匹配当前获取的域名,是同域还是第三方系统。 如果同域,直接将redirectUrl返回,无需携带code接口返回的值。如果是第三方系统,需要处理 redirectUrl。因为可能用户会做登录成功再退出,那么带到登录系统的redirectUrl就会携带code值,我们需要通过js的方法去替换原来的code值。

  • 成功返回redirectUrl

一切流程通了之后,通过 location.replace(redirectUrl) 浏览器跳转返回到重定向页面

目标达成: 子系统在未登录的情况下,点击【登录】按钮,跳转到统一用户中心。统一用户中心判断当前cookies是否有token存在,如果不存在--登录;如果存在就去校验token的合法性(调取code接口),调取code接口成功,重定向到原页面。那么同域下所有的子系统,都无需登录。第三方系统进来的时候,因为做了domian的校验,因此登录成功之后,将code码放在redirectUrl,重定向到第三方系统。


 

你可能感兴趣的:(学习,前端,前端框架)