印峰 发表于 2023-12-25 16:08:50

keycloak~对接login-status-iframe页面判断用户状态变更

上次我们说了,keycloak的login-status-iframe页面的作用,并解决了跨域情况下,iframe与主页面数据传递的方法,这一次,我们主要分析login-status-iframe.html这个文件的源码,然后分析在我们系统中如何与这个页面对接。
login-status-iframe.html源码

具体方法说明

这个页面主要由以下4个方法组成,下面分别去介绍

[*]checkState(clientId, origin, sessionState, callback)检查当前浏览器上,用户在keycloak登录的状态
[*]getCookie()获取cookie中存储的用户状态
[*]getCookieByName(name)获取指定key的cookie值
[*]receiveMessage(event)接收从父页面通过postMessage传过来的消息
getCookieByName方法

按着指定向名称,从浏览器的cookie中获取,这是所有可见cookie的字符串,每对使用分号分开,咱们这个方法是返回了某个key对应的具体value.
getCookie方法

获取KEYCLOAK_SESSION的值,如果它不存在,就获取KEYCLOAK_SESSION_LEGACY的值,之所以有KEYCLOAK_SESSION_LEGACY,主要是考虑到了浏览器的兼容性问题。
receiveMessage方法

这个方法主要是用来接收主页面发过来的数据,然后进行状态检查的,子页面通过window.addEventListener("message", receiveMessage, false);来进行事件监听,主页面会提供client_id和sesssion_state,并使用空格将两个参数分开,然后在回调方法里,会向主页面进行通知,通过event.source.postMessage(result, origin);实现,result表示通知的内容,origin表示主页面的域名,其实这是为了安全考虑的,在主页面收到消息后,也会判断这个origin,会判断是否从子页面的域名;所以这个origin其实是事件的发起者的域名。
checkState方法

这是整个login-status-iframe.html页面的核心方法,主要用来判断登录状态,下面分步骤说一下:

[*]它首先会从浏览器cookie中拿出KEYCLOAK_SESSION的值,它和主页面传过来的值做对比,如果相同状态就没改变(可能已登录或者未登录),如果不相同,如果说明状态改变了;
[*]判断init是否初始化,如果没有,就从login-status-iframe.html/init?client_id=...这个keycloak的接口中,异步获取登录状态写入浏览器cookie,然后再用步骤1做状态判断;
[*]如果init已经完成初始化,就直接检查cookie中的用户状态
主页面对接login-status-iframe.html页面


来源:https://www.cnblogs.com/lori/p/17925956.html
免责声明:由于采集信息均来自互联网,如果侵犯了您的权益,请联系我们【E-Mail:cb@itdo.tech】 我们会及时删除侵权内容,谢谢合作!
页: [1]
查看完整版本: keycloak~对接login-status-iframe页面判断用户状态变更