前后端分离单点登录SSO纯前端实现单点登录SSO
以前涉及到单点登录，都是⽤CAS解决的，不过体验不是很好，但是也确确实实实现了单点登录，利⽤了session会话。后来我到了公司的架构部，部门决定重新定位前端技术路线，我⼤胆地采⽤了前后端分离的⽅式，让前端⼯程化，这样遇到单点登录就涉及到⼀个问题，前端已经不存在session会话了，于是我就采⽤cookie，将登录信息存储进cookie，这时有⼈就会问，cookie是不是不安全，在我看来session和cookie的安全级别是差不多的，都很容易被攻击。如果对于内⽹项⽬，可以暂不考虑，如果是外⽹项⽬则必须采⽤https协议。
现在我就简单地说下我是如何实现的吧：
⽐如现在有a、b、uc；a和b中利⽤iframe嵌套uc，利⽤html5跨域通讯postMessage将在a中登录的信息告知uc，然后uc将需要保存的信息存⼊cookie，a也将需要保存的信息存⼊cookie；此时访问b时，b中的iframe中的uc会将cookie中的登录信息通过postMessage告知b这些信息，然后b将这些信息存⼊cookie中，此时b就是已登录状态了，⽆需再登录，这样便实现了单点登录。以上反之则是未登录。
上⼀种⽅式对于安全性较⾼的Safari和Opera浏览器是不可⾏的，不同之处在于这些浏览器不允许iframe中跨域存储cookie，此时解决⽅案是在a中登录后将信息存⼊cookie，然后跳转⾄利⽤iframe嵌套a
的uc，a将cookie中的登录信息传递给uc，这样uc就获取到了登录信息，然后存储进cookie，然后利⽤浏览器路径替换⽅式进⼊a，这样便实现了单点登录。
我的⽅法很简单，有⼀个地⽅需要注意，就是postMessage只将信息发送给约定好的域，iframe只被约定好的域嵌套！
单点登录SSO-流程图：
对于安全性较⾼的浏览器，单点登录SSO-流程图：
是不是很简单，⽬前我是这么解决的，如果谁有更好的想法的话，就在此请求你⼀起分享下吧~
补充：前端和后端交互的时候，基本都是和rest风格的接⼝交互，我平时交互的时候都是头部信息中放⼊后端以JWT形式⽣成的token，后端获取请求时去解析前端传过来的token值，然后判断后给以相应的处理。这⾥就不介绍JWT了，关于JWT的⽂章泛滥了~前端跟后端哪个就业难

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。