前端单点登录(SSO)
单点登录的理解:
单点登录(SSO)是整合企业系统的解决方案之一,旨在多个应用系统中,用户只需要登录一次就可以访问所有相互信任的应用系统。
要实现单点登录,就需要先了解域名之间的关系和格式,域名分为顶级域名(也称主域名和一级域名)、二级域名、三级域名等。
顶级域名:cnblogs.com
二级域名:i.cnblogs.com
三级域名:aa.i.cnblogs.com
单点登录流程(拿VUE项目做案例):
我们登录成功后,后台会返回一个token给我们,我们需要把它存到Cookie里面,方便后面使用。然后请求接口的时候,会在接口带一个token过去给服务器,做为验证当前系统是否已经登录,或者登录过期的依据。
vue请求页面接口的时候,做一个请求拦截,如果在Cookie里面有token,则直接请求数据,正常进入页面;如果没有token,说明项目没有登录,则控制路由跳转去登录页面。
所以只要在不同级别的域名下,获取保存在Cookie里面的token就可以了,只要在设置cookie的时候把domain设置为主域名,就可以在其他二级、三级域名下找到token,这就是主要流程了。
单点登录的实现代码:
/** * Cookies.set传三个值,第一个是cookie的名称,第二个是设置token,第三个是路劲和cookie的域名 */ Cookies.set( "name", // 设置cookie的名称 "value", // 设置token { path: "/", // 这里不能把/去掉,否则会出现bug,可能导致找不到domain domain: "cnblogs" // 设置主域名(关键点) } )
退出登录的时候,把设置的这个Cookie清除就可以了:
Cookies.set( "name", // 清除的cookie的名称 null, { expires: -1, // 有效期设置负数,cookie会自动清空 path: "/", domain: "cnblogs" // 主域名 } )
OK,到这里单点登录就完成了。
版权声明:本文为博主原创文章,转载需注明出处。https://www.cnblogs.com/silent007/p/15207581.html
*************************************** END ***************************************