Getting Users SessionID from Okta Sign-in Wudget

1.3k views Asked by At

So I'm using the Okta Sign-In Widget to authenticated users for my internal WebApp.

However, I'm struggling how I get the sessionID from the created session stored in a cookie from my domain or posted back in a response to then be saved, so it can be then used later to carry out actions on that users session (for instance logout). My JavaScript ability is terrible but I'm trying to learn here. Please see below my code for the login page. If someone could help me how I can as a response from the login get the sessionID to then be used, it would be greatly appreciated.

<!DOCTYPE html>
<html>
<head>
<?php echo $MetaData['charset']."\n";?>
<?php echo $MetaData['viewport']."\n";?>
<?php echo $MetaData['description']."\n";?>
<?php echo $MetaData['author']."\n";?>
<?php echo $MetaData['title']."\n";?>

<link rel="shortcut icon" href="">
<script src="https://ok1static.oktacdn.com/assets/js/sdk/okta-signin-widget/1.7.0/js/okta-sign-in.min.js" type="text/javascript"></script>
<link href="https://ok1static.oktacdn.com/assets/js/sdk/okta-signin-widget/1.7.0/css/okta-sign-in.min.css" type="text/css" rel="stylesheet">
<link href="https://ok1static.oktacdn.com/assets/js/sdk/okta-signin-widget/1.7.0/css/okta-theme.css" type="text/css" rel="stylesheet">
<link href="<?php echo base_url().'assets/css/custom.css' ?>"type="text/css" rel="stylesheet">
</head>
<body style="background-color:#f5f5f5;">
 <div id="okta-login-container"></div>
 <script type="text/javascript">
  var orgUrl = '<?php echo $OktaInstanceConfig['OktaInstanceURL'];?>';
    var redirectUrl = '<?php echo base_url().'index.php/Dashboard' ?>';
    var oktaSignIn = new OktaSignIn({
   baseUrl: orgUrl,
   logo: '<?php echo base_url()."assets/images/".$CompanyConfig["CompanyName"]."/logo.svg"?>',
   authParams: {
  responseType: 'id_token',
  responseMode: 'okta_post_message',
  scope: [
   'openid',
   'email',
   'profile',
   'address',
   'phone',
   'groups'
      ]
          }
  });

  oktaSignIn.renderEl(
    { el: '#okta-login-container' },
    function (res) {
      if (res.status === 'SUCCESS')
        {
          console.log('User %s successfully authenticated %o', res.user.profile.login, res.user);
          res.session.setCookieAndRedirect(redirectUrl);
        }
    }
  );
 </script>
</body>
</html>

1

There are 1 answers

1
jmelberg On

Okta sets the user session after the method setCookieAndRedirect(redirectUrl) is called.

The logic inside of your redirectUrl (index.php) can get the sessionId by retrieving the current session using the Sign-In Widget:

<!-- index.php -->
<!DOCTYPE html>
<html>
    <head> <!-- scripts and stylesheets --> </head>

    <body>
        <script type="text/javascript">

            var oktaSignIn = new OktaSignIn({ /* config */});

            oktaSignIn.session.exists(function (exists) {
                if (exists) {
                    // Session exists
                    oktaSignIn.session.get(function (sessionInfo) {
                        // sessionInfo.id
                    }, function(err) { // error retrieving session })
                        return;
                    } else { console.log("No session");
                }
            });

        </script>
    </body>
</html>