Sign on widget help

Tbh I don’t know the first thing about javascript but I’m working on getting the developer cert since I got consultant and I’m a completionist and I’m struggling with the sign on widget portion of the hands on practice test.

Right now the issuer and client id are not real but i doubt those are the problem. I left the redirect URI unchanged. (this is because my test timed out and I wanted to start what I had over at a basic level).

My code is below and when I check chrome developer tools I get the following error. (index):26 Uncaught ReferenceError: OktaSignIn is not defined

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Welcome to Okta Cert</title>
	<!-- Okta Sign-In Widget: Core js and css -->
	<script src="https://ok1static.oktacdn.com/assets/js/sdk/okta-signin-widget/7.23.1/js/okta-sign-in.min.js" type="text/javascript"></script> 
	<link href="https://ok1static.oktacdn.com/assets/js/sdk/okta-signin-widget/7.23.1/css/okta-sign-in.min.css" type="text/css" rel="stylesheet"> 
  <!-- Okta Sign-In Widget: Customizable css theme options. Link your own customized copy of this file or override styles in-line -->
	<link href="https://ok1static.oktacdn.com/assets/js/sdk/okta-signin-widget/7.23.1/css/okta-theme.css" type="text/css" rel="stylesheet">
</head>
<body>
  <div class="title">Welcome to Okta Cert</div>
  <hr>
  <div class="title">Please enter your credentials below to continue to your Okta org.</div>

  <div id="okta-login-container"></div>

  <div class="footer">
    Copyright 2009-2022 Okta Cert. All rights reserved.
  </div>

  <script type="text/javascript">
var signIn = new OktaSignIn(
  {
    issuer: 'https://okta-org-jj234.okta.com/oauth2/default',
    clientId: '23423dsvfdsfsd',
    redirectUri: 'https://flowery-meadow-diagram.glitch.me',
  }
);

oktasignIn.showSignIn({
  // Assumes there is an empty element on the page with an id of 'osw-container'
  el: 'okta-login-container'
}).then(function(res) {
  // Most flows will not require any redirection. In these cases, tokens will be returned directly.
  // res.tokens is an object
  oktaSignIn.authClient.handleLoginRedirect(res.tokens);
}).catch(function(error) {
  // This function is invoked with errors the widget cannot recover from:
  // Known errors: CONFIG_ERROR, UNSUPPORTED_BROWSER_ERROR
});
	</script> 

  <!-- Default page style -->
  <style>
    .title {
      padding: 40px;
      font: normal 34px/1 Verdana, Geneva, sans-serif;
      color: black;
      text-align: center;
      letter-spacing: 7px;
    }
    .footer {
      font: normal 14px/1 Verdana, Geneva, sans-serif;
      padding: 10px;
      color: black;
      position: fixed;
      bottom: 0;
      width: 100%;
      background-color: #F0F0F0;
    }
  </style>
  <!-- Default page style -->
</body>
</html>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.