quick-authentication

Best practices for integrating quick authentication on web

Using prompt

Use ms.auth.prompt instead of auto_prompt option.

This is because ms.auth.prompt can be configured with PromptMomentNotification callback.

This allows developer to understand the result of calling the API. Some examples below:

• If prompt was shown, the callback will be called with {type: 'display', displayed: true}.
• If the user closed the prompt, the callback will be called with {type: 'skipped', reason: 'user_cancelled'}.
• If sign-in succeeded, the callback will be called with {type: 'dismissed', reason: 'credential_returned'}.
• If sign-in failed, the callback will be called with {type: 'dismissed', reason: 'credential_obtain_failed'}.

The default value of cancel_on_tap_outside is true, which means the prompt will close when tapped outside. You can consider changing this to false to ensure that user acts on it.

Detect sign-in failure

The Javascript callback for authentication has two parameters.

If sign-in fails, then the first parameter is null. And the second parameter signInErrorInfo will contain the error information. Developer can use the second parameter to detect sign-in failures. A common example is when user cancels out of the sign-in flow. In this case, they will get the following error info object:

{
  errorCode: 'user_cancelled',
  errorMessage: 'User cancelled the flow'
}

Passing callback to ms.auth.startSignIn

If ms.auth.startSignIn API is used for sign-in, then you can consider using the parameter startSignOptions to pass a Javascript callback function.

This will ensure that sign-in events originating from ms.auth.startSignIn will be routed to that callback.

If there are multiple sign-in options on a page, e.g., prompt, sign-in button, etc., then this allows developer to detect that the sign-in attempt was started using ms.auth.startSignIn.

Use ms.auth.hasMSAAccount to optimize for MSA

ms.auth.hasMSAAccount can be used to determine whether the website is opened in MSA profile in Edge. This is the scenario for which Quick Auth is most optimized. So, if this returns true then consider prioritizing Microsoft sign-in in your UX.

ms.auth.hasMSAAccount(function(hasMSAAccount) {
  if (hasMSAAccount) {
    // There is a MSA account in the profile.
    // Make MSA button more prominent.
    // Stop showing prompts for other providers.
  } else {
    // No MSA account in the profile.
    // Show prompts from other providers.
  }
});

This site is open source. Improve this page.