Skip to content

Instantly share code, notes, and snippets.

@ritou
Created July 20, 2012 08:21
Show Gist options
  • Save ritou/3149557 to your computer and use it in GitHub Desktop.
Save ritou/3149557 to your computer and use it in GitHub Desktop.
OpenID Connect Session Management Demo

OpenID Connect Session Management Demo

Spec

URLs

Step 1. Visit the RP

Visit the RP

Click to "Authentication" link and start flow.

Step 2. Sign in to the OP

Sign in to the OP

Choose the Fake Account.

Step 3. Authorization

Authorization

Step 4. Start to check OP Session Status

Start to check OP Session Status

The RP checks a session of OP every three seconds.

Step 5. Sign-out at OP

Sign-out at OP

Open the new window and visit OP, and click to "Logout" button.

Step 6. Session synchronization

Session synchronization

The RP receives a change of the status and notifies own user.

Extra step : RP initiated Logout

If the user logout of RP, it is sent to OP logout URL.

RP initiated Logout

At OP logout URL, OP displays a confirmation screen to user and lets user logout.

RP initiated Logout 2

Sample Code : OP iframe URL

<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>OpenID Connect Sandbox</title>
        <script src="https://crypto-js.googlecode.com/svn/tags/3.0.2/build/rollups/sha256.js"></script>
        <script language="JavaScript" type="text/javascript">
            window.addEventListener("message",receiveMessage, false);
            function receiveMessage(e){
                var origin = "http://www8322u.sakura.ne.jp"; // origin from client_id
                if ( e.origin !== origin ) {
                    return;
                }

                var stat;
                var client_id = "77596671429810a5f9fcaf7404216f70f29cd40c"; // from ID Token
                var salt = getSaltFromData(e.data); // from e.data
                var opss = getOpssFromCookie(); // from Cookie or use API access
                var ss = CryptoJS.SHA256(client_id + origin + opss + salt) + "." + salt;  
                if (e.data == ss) {
                    stat = 'unchanged';
                } else {
                    stat = 'changed';
                }
                e.source.postMessage(stat, e.origin);
            };

            function getSaltFromData(data){
                var salt = "";
                var split_data = data.split(".");
                if(split_data.length == 2){
                    salt = split_data[1];
                }
                return salt;
            }

            function getOpssFromCookie(){
                var theName = "OPS=";
                var theCookie = document.cookie+";";
                var start = theCookie.indexOf(theName);
                if (start != -1)
                {
                    var end = theCookie.indexOf(";",start); // データを抜きだす
                    return unescape(theCookie.substring(start+theName.length,end));
                }
                return "";
            }
        </script>
    </head>
    <body>
    This is OpenID Connect Session Management op_iframe URL.
    </body>
</html>
  • client_id, origin : from ID Token
  • salt : from data
  • opss : from Cookie

Sample Code : RP iframe URL

<html>
    <head>
        <title>OpenID Connect Session Management Sample RP : RP iframe</title>
        <script src="http://crypto-js.googlecode.com/svn/tags/3.0.2/build/rollups/sha256.js"></script>
        <script language="JavaScript" type="text/javascript">
            var stat = "unchanged";
            var client_id = "77596671429810a5f9fcaf7404216f70f29cd40c";
            var origin = "http://www8322u.sakura.ne.jp";
            var opss = "c1a43afe7e07935514d13a730fe6739a6e8b80344601fad8c429ee58b25b45f3";
            var salt = "6dc1ed929c268f433a9fe00a8e1afdf56be8a4ec";
            var mes = CryptoJS.SHA256(client_id + origin + opss + salt) + "." + salt;
            var targetOrigin  = "https://openidconnect.info";

            function check_session()
            {
                var win = window.parent.document.getElementById("op").contentWindow;
                win.postMessage( mes, targetOrigin);
            }

            function setTimer()
            {
                window.parent.document.getElementById('notice').innerHTML = "Checking OP Session Status.";
                check_session();
                timerID = setInterval("check_session()",3*1000);
            }

            window.addEventListener("message", receiveMessage, false);

            function receiveMessage(e)
            {
                if (e.origin !== targetOrigin ) {return;}
                stat = e.data;
                noticeToParentWindow(stat);
            }

            function noticeToParentWindow(stat){
                if (stat == "changed") {
                    window.parent.document.getElementById('notice').innerHTML = "You are logged out at openidconnect.info.";
                }else{
                    window.parent.document.getElementById('notice').innerHTML = "";
                }
            }
        </script>
    </head>
    <body onload="setTimer()">
This is rp_iframe
    </body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment