Relying party iFrame
This is only a sample of a relying party iFrame that you can use. For details, refer to the pseudo code for Relying Party iFrame on the OIDC specification site.
Comments are added in the following sample, to highlight actions items for implementation or configuration.
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>OpenID Connect RP Session frame</title></head>
<body>
<script>
/*<![CDATA[*/
var targetOP = "https://OPserver.example.com"; //URL of the OP
window.addEventListener("message", receiveMessage, false);
var scheduledCheck;
window.onload = function () {
// Check shortly after onload
setTimeout(checkStatus, 2000);
// Do not forget to deregister scheduled callback using clearInterval(checkStatus)
scheduledCheck = setInterval(checkStatus, 1000*20); //Every 20 seconds
};
function getCookieValue(cookieName) {
var name = cookieName + "=";
var cookies = document.cookie.split(";");
if (!cookies) {
return null;
}
for (var i = 0; i < cookies.length; i++) {
var cookie = cookies[i].trim();
if (cookie.indexOf(name) === 0) {
return cookie.substring(name.length, cookie.length);
}
}
return null;
}
function checkStatus() {
var client = "oidc"; //This is the clientId that is configured on the OP
//You can name this cookie whatever you want, it must be stored in a cookie after the authentication response, so that it is accessible here
var sessionState = getCookieValue("session_state");
var text = client + " " + sessionState;
var iframe = window.parent.document.getElementById("opif"); //This is the ID of the OP iFrame that you set when including them on the main page
iframe.contentWindow.postMessage(text, targetOP);
}
function receiveMessage(event) {
if (event.origin !== targetOP) {
// Origin did not come from the OP. This message must be rejected
return;
}
if (event.data === "unchanged") {
// User is still logged in to the OP, don't need to do anything
} else {
// Detected a change at OP
// Perform authentication with `prompt=none` to check authentication status
}
}
/*]]>*/
</script>
</body>
</html>
