AdalAngular6ServiceError - Managing Unauthorized Login Attempts

In my Angular 7 application, I am utilizing the ms-adal-angular6 library to handle authentication flow and I am trying to understand the sequence of events in my code.

After successfully authenticating with Azure Active Directory (AAD) using a logged-in user account, I receive a fully populated MsAdalAngular6Service variable containing all necessary properties.

How can I identify if the login process fails during this procedure? Below is the snippet of my code:

 export class AppComponent {

    constructor(private adalSvc: MsAdalAngular6Service) {

    var token = this.adalSvc.acquireToken('http://adal.resource.com').subscribe((token: string) => {            
       // This works fine for pre-logged in users, token is valid
    });

    }
}

Where should I implement the logic to detect any failure in this entire process? Our system includes both individual user accounts and Azure AD integration, and users failing to pass the Azure AD step should be redirected to an alternative process.

Is it sufficient to verify the validity of the returned token? The adalSvc object contains complete user information for individuals who have already completed the Azure AD login.

Answer №1

When you authenticate using AAD, the process is managed independently on the "AAD portal" rather than on your website. After a successful login, the AD portal will redirect to the specified "redirect URL" with a valid token.

If the login attempt fails, an error page like the one below will be displayed and there will be no redirection:

https://i.sstatic.net/Jmfrr.png

Furthermore, this page cannot be customized, meaning you cannot add another login link or any notifications for the user here.

In order to meet your requirements, it is recommended to create a page where users can choose to log in either through AAD or their individual accounts. With ms-adal-angular6, you can set popUp:true so that the login page appears in a pop-up window instead of a new page. If the login is unsuccessful, the user simply needs to close the window and select a different login method.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Develop an Angular 6 application that utilizes an observable to monitor changes in a variable

I am working with Angular 6 and I need to monitor a variable for any changes and then stop or unsubscribe when the variable has a value. My initial thought was to use an Observable: myValue; // The variable that needs to be monitored myObservable = Obse ...

typescript ways to exclude enum values

I am working with enums in TypeScript. enum Status { Cancelled = 'cancelled', Completed = 'completed', Created = 'created' } Now, I need to create another enum that includes only the values Completed and Created. enum S ...

Obtaining the TemplateRef from any HTML Element in Angular 2

I am in need of dynamically loading a component into an HTML element that could be located anywhere inside the app component. My approach involves utilizing the TemplateRef as a parameter for the ViewContainerRef.createEmbeddedView(templateRef) method to ...

TypeScript generic types allow you to create reusable components that

function genericIdentity<T>(arg: T): T { return arg; } let myGenericIdentity: <U>(arg: U) => U = genericIdentity; I see that the 'genericIdentity' function is accepting an argument of a generic type. However, I am unsure about ...

Instructions for adding a name to a string based on certain conditions

I am attempting to prepend a company name to a card number using the code provided. The challenge I am facing is incorporating the specific rules for each company as conditions for an if statement. Although I acknowledge that my current approach with the ...

How can I determine the data type of an Array element contained within an Interface member?

Is there a way to extract the type of key3 in MyInterface2 and use it in key3Value, similar to key2Value? interface MyInterface { key1: { key2: string } } const key2Value: MyInterface['key1']['key2'] = 'Hi' / ...

Enhance the TypeScript interface by dynamically appending new fields with specific naming conventions

My interface is structured like this: interface ProjectCostData { purchasePrice: number; propertyValue: number; recentlyDamaged: boolean; } Now I am looking to dynamically create a new interface based on the one above: interface ProjectCostDataWithS ...

What is preventing TypeScript from identifying the type of a parent based on its child?

Take a moment to explore the following example: type Num = { type: 'NUMBER' numberValue: number } type Str = { type: 'STRING', stringValue: string } type B_Num = { a: Num; numberData: number; } type B_Str = { ...

Angular4: The Process of Iterating Through an Array of Objects within an Object

I'm struggling to iterate through an Object that contains an array of objects within an anchor tag. Here's how my code is structured: {"1":{"uri":"test1","name":"test1","icon":"http:\/\/dummyurl\/images\/icons\/test1-ico ...

Typescript UniqueForProp tool not working as expected

I've created a utility function called UniqueForProp that takes an array of objects and a specified property within the object. It then generates a union type containing all possible values for that property across the array: type Get<T, K> = K ...

Guide to activating data transfer object validators in NEST JS

I have recently started using NEST JS and I am currently working on implementing validators in DTO's. This is what my code looks like: // /blog-backend/src/blog/dto/create-post.dto.ts import { IsEmail, IsNotEmpty, IsDefined } from 'class-validat ...

Creating click event handler functions using TypeScript

I encountered an issue when trying to set up an event listener for clicks. The error message I received was that classList does not exist on type EventTarget. class UIModal extends React.Component<Props> { handleClick = (e: Event) => { ...

Is there a way to define an object's keys as static types while allowing the values to be dynamically determined?

I am attempting to construct an object where the keys are derived from a string union type and the values are functions. The challenge lies in wanting the function typings to be determined dynamically from each function's implementation instead of bei ...

Angular positions the <style> element following the custom stylesheet <link>

I need help understanding Angular styling. Currently, I am working with Angular 10 and Prime-ng. I have created a custom style to override a Prime-ng component's style. However, when I serve the app for testing, the custom style does not override it ...

Error: Property 'instance' is undefined and cannot be read

Trying to confirm the functionality of the following method: showSnackbar(): void { if (this.modifiedReferences.length) { const snackbar = this.snackbarService.open({ message: '', type: 'success', durat ...

When the form is submitted, the HTMLCollection becomes void

I am facing an issue with a form that always seems to be invalid. To troubleshoot, I tried running this command in my web browser to identify the invalid fields: document.getElementsByClassName('ng-invalid'); However, the HTMLCollection returned ...

Dealing with incorrect type declarations in Typescript when using Material-UI Higher Order Components can

Currently, I am in the process of upgrading from Material-UI 1.x to the newer version Material-UI 3.9.2. I had several components that were functioning well with Higher Order Components (HOC), but when it comes to migrating them to 3.9.2, I am facing some ...

Solving the issue where the argument type is not assignable to the parameter type

I am attempting to filter an array of objects in React using TypeScript and encountered this error. Below is my interface, state, and function: TS2345: Argument of type '(prev: IBudget, current: IBudget) => IBudget | undefined' is not assigna ...

Refresh Chart Information using Ng2-Charts in Charts.js

Utilizing chart.js and ng2-charts, I am developing gauge charts for my platform to monitor the fluid levels inside a machine's tank. The values are retrieved from an external API, but I am encountering an issue where the charts are rendered before I ...

Keep verifying the boolean value repeatedly

I've been working on implementing infinite scroll functionality for my card elements. Within my data.service file, I have a variable called reload that is utilized to determine whether more data needs to be loaded. This variable is set to true when th ...