<iframe src="https://www.googletagmanager.com/ns.html?id=GTM-M74D8PB" height="0" width="0" style="display:none;visibility:hidden">
Loading
Skip to NavigationSkip to Main Content
0D50Z00008G7VTaSANOkta Classic EngineAdministrationAnswered2018-09-05T01:28:21.000Z2017-09-25T19:11:20.000Z2018-02-07T16:01:05.000Z
Okta Signin Widget/Password Recovery Flow
We have been using a in house page with your sign in widget embedded. However, we don’t know how to redirect to page and instruct the widget to go to a different starting point other than the sign in. we would like to redirect to the page with the widget, but the widget needs to go to the password question challenge, then password reset rather than the sign in. Is this possible?

Is the password question challenge/password reset available in the widget?

As of now we have a vanilla Okta page and need to be performing the password reset flow inside our properly skinned Okta widget.


  • Thanks for contacting Okta.

     

    Here is our article regarding the Sign-in Widget that would help you with your implemention:

    https://developer.okta.com/code/javascript/okta_sign-in_widget_ref#api

     

    There is "Adding a Redirect" section there that you can check and follow the instructions there to add a redirect URL to your widget.

     

    Also the following would help as well:

     

    Username and password

     

    username: Prefills the username input with the provided username

     

      username: 'john@acme.com'

    transformUsername: Transforms the username before sending requests with the username to Okta. This is useful when you have an internal mapping between what the user enters and their Okta username.

     

      // The callback function is passed two arguments:

      // 1) username: The name entered by the user

      // 2) operation: The type of operation the user is trying to perform:

      //      - PRIMARY_AUTH

      //      - FORGOT_PASSWORD

      //      - UNLOCK_ACCOUNT

      transformUsername: function (username, operation) {

        // This example will append the '@acme.com' domain if the user has

        // not entered it

        return username.indexOf('@acme.com') > -1

          ? username

          : username + '@acme.com';

      }

    processCreds: Hook to handle the credentials before they are sent to Okta in the Primary Auth, Password Expiration, and Password Reset flows.

     

    If processCreds takes a single argument it will be executed as a synchronous hook:

     

      // Passed a creds object {username, password}

      processCreds: function (creds) {

        // This example demonstrates a partial integration with ChromeOS

        google.principal.add({

          token: creds.username,

          user: creds.username,

          passwordBytes: creds.password,

          keyType: 'KEY_TYPE_PASSWORD_PLAIN'

        });

      }

    If processCreds takes two arguments it will be executed as an asynchronous hook:

     

      // Passed a creds object {username, password} and a callback for further processing

      processCreds: function (creds, callback) {

        // This example demonstrates optional legacy form-based login

        $.ajax({

          method: "POST",

          url: "/logintype",

          data: {

            username : creds.username

          },

          success: function (logintype) {

            if (logintype == "LEGACY") {

              $('#legacyUser').val(creds.username);

              $('#legacyPassword').val(creds.password);

              $('#legacyLogonForm').submit();

            } else {

              callback();

            }

          }

        });

      }

    Changing help links

     

    You can override the help link urls on the Primary Auth page by setting the following config options. If you’d like to change the help link text, use the i18n config option.

     

    // An example that overrides all help links, and sets two custom links

    helpLinks: {

      help: 'https://acme.com/help',

      forgotPassword: 'https://acme.com/forgot-password',

      unlock: 'https://acme.com/unlock-account',

      custom: [

        {

          text: 'What is Okta?',

          href: 'https://acme.com/what-is-okta'

        },

        {

          text: 'Acme Portal',

          href: 'https://acme.com'

        }

      ]

    }

    helpLinks.help - Custom link href for the “Help” link

     

    helpLinks.forgotPassword - Custom link href for the “Forgot Password” link

     

    helpLinks.unlock - Custom link href for the “Unlock Account” link. For this link to display, features.selfServiceUnlock must be set to true, and the self service unlock feature must be enabled in your admin settings.

     

    helpLinks.custom - Array of custom link objects {text, href} that will be added to the “Need help signing in?” section.

     

    Thanks,

    Behrouz Ghorchi

    Technical Support Engineer

    Okta Global Customer Care
    Expand Post
  • I would add to Behrouz's great answer that you may want to take a look at "features.router" on that page.
This question is closed.
Loading
Okta Signin Widget/Password Recovery Flow