Hello,
I want to make my website depending of Okta widget authentication. I’m using vanilla Javascript and HTML / CSS.
I wrote a function in an external script (I will post it after) and I call this function in every html pages. This function is wrapping the Okta Signin Widget to manage credentials. I notice the functions are asynchronous.
I have two problems because of the asynchronous execution :
- Some of the HTML need information retrived from Okta so they get undefined value (because of asynchronous result)
- The widget is shown later than HTML pages in case it need to show the widget or refuse accesses
So my main question is : how to make my function synchronous ? I tried with awayt / sync javascript function but i didn’t achieve anything. Is there a callback available i’m missing ?
Thanks for you help !!
The code :
function invokeOkta(onLoginPage) {
onLoginPage = onLoginPage || false
var oktaSignIn = new OktaSignIn({
    baseUrl: "xxxx",
    clientId: "xxx",
	logo: 'xxxx',
	redirectUri: "xxx" ,
    authParams: {
      issuer: "https://xxxx",
      responseType: ["token", "id_token"],
      display: "page"
    }
  });
  if (oktaSignIn.token.hasTokensInUrl()) {
    oktaSignIn.token.parseTokensFromUrl(
      // If we get here, the user just logged in.
      function success(res) {
        var accessToken = res[0];
        var idToken = res[1]
        oktaSignIn.tokenManager.add("accessToken", accessToken);
        oktaSignIn.tokenManager.add("idToken", idToken);
      },
      function error(err) {
        console.error(err);
      }
    );
  } else {
    oktaSignIn.session.get(function (res) {
      // If we get here, the user is already signed in.
      if (res.status === 'ACTIVE' && !onLoginPage)
		{
			// do some code
			return;
		}
      // If we get here, the user is not logged in, so we should show the sign-in form.
      if(onLoginPage) {
        oktaSignIn.renderEl(
            { el: '#sign-in-container' },
              function success(res) {},
                function error(err) {
                  console.error(err);
            }
        );
      } else {
        window.location.href = "login.html";
      }
    });
  }
}