我正在尝试集成一个示例角应用程序和Azure活动目录。为此我用了
请找到我做过的步骤。
步骤-1在试用版Azure订阅中注册应用程序。将重定向URI设置为http://localhost:4200
步骤2选择隐式授予、访问令牌和ID令牌。
Step-3 App.Module I是这样修改的.
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { ProfileComponent } from './profile/profile.component';
import { MsalModule, MsalInterceptor } from '@azure/msal-angular';
import { HTTP_INTERCEPTORS, HttpClientModule } from '@angular/common/http';
import { HomeComponent } from './home/home.component';
const isIE = window.navigator.userAgent.indexOf('MSIE ') > -1 || window.navigator.userAgent.indexOf('Trident/') > -1;
@NgModule({
declarations: [
AppComponent,
ProfileComponent,
HomeComponent
],
imports: [
BrowserModule,
AppRoutingModule,
HttpClientModule,
MsalModule.forRoot({
auth: {
clientId: 'MyclientId', // This is your client ID
authority: 'https://login.microsoftonline.com/MytenantId', // This is your tenant ID
redirectUri: 'http://localhost:4200'// This is your redirect URI
},
cache: {
cacheLocation: 'localStorage',
storeAuthStateInCookie: isIE, // Set to true for Internet Explorer 11
},
}, {
popUp: !isIE,
consentScopes: [
'user.read',
'openid',
'profile',
],
unprotectedResources: [],
protectedResourceMap: [
['https://graph.microsoft.com/v1.0/me', ['user.read']]
],
extraQueryParameters: {}
})
],
providers: [
{
provide: HTTP_INTERCEPTORS,
useClass: MsalInterceptor,
multi: true
}
],
bootstrap: [AppComponent]
})
export class AppModule { }步骤4我的应用程序
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { ProfileComponent } from './profile/profile.component';
import { MsalGuard } from '@azure/msal-angular';
import { HomeComponent } from './home/home.component';
const routes: Routes = [
{
path: 'profile',
component: ProfileComponent,
canActivate: [
MsalGuard
]
},
{
path: '',
component: HomeComponent
}
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }Step-5 AppComponent
import { Component,OnInit } from '@angular/core';
import { MsalService, BroadcastService } from '@azure/msal-angular';
import { CryptoUtils, Logger } from 'msal';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
isIframe = false;
loggedIn = false;
constructor(private broadcastService: BroadcastService, private authService: MsalService) { }
ngOnInit(): void {
this.isIframe = window !== window.parent && !window.opener;
this.checkAccount();
this.broadcastService.subscribe('msal:loginSuccess', () => {
this.checkAccount();
});
this.authService.handleRedirectCallback((authError, response) => {
if (authError) {
console.error('Redirect Error: ', authError.errorMessage);
return;
}
console.log('Redirect Success: ', response.accessToken);
});
this.authService.setLogger(new Logger((logLevel, message, piiEnabled) => {
console.log('MSAL Logging: ', message);
}, {
correlationId: CryptoUtils.createNewGuid(),
piiLoggingEnabled: false
}));
}
checkAccount() {
this.loggedIn = !!this.authService.getAccount();
}
login() {
const isIE = window.navigator.userAgent.indexOf('MSIE ') > -1 || window.navigator.userAgent.indexOf('Trident/') > -1;
if (isIE) {
this.authService.loginRedirect({
extraScopesToConsent: ["user.read", "openid", "profile"]
});
} else {
this.authService.loginPopup({
extraScopesToConsent: ["user.read", "openid", "profile"]
});
}
}
logout() {
this.authService.logout();
}
}Step-6 ProfileComponent
import { Component, OnInit } from '@angular/core';
import { MsalService } from '@azure/msal-angular';
import { HttpClient } from '@angular/common/http';
const GRAPH_ENDPOINT = 'https://graph.microsoft.com/v1.0/me';
@Component({
selector: 'app-profile',
templateUrl: './profile.component.html',
styleUrls: ['./profile.component.css']
})
export class ProfileComponent implements OnInit {
profile:any;
constructor(private authService: MsalService, private http: HttpClient) { }
ngOnInit() {
this.getProfile();
}
getProfile() {
this.http.get(GRAPH_ENDPOINT).toPromise()
.then(profile => {
this.profile = profile;
});
}
}我遵循了以下链接https://learn.microsoft.com/en-us/azure/active-directory/develop/tutorial-v2-angular中给出的相同步骤
应用程序登录。当我检查会话存储时,能够看到令牌。但是当访问配置文件组件时。它将抛出以下错误。我无法理解为什么我会犯这个错误。我错过了什么吗。请引导我,我错过了什么。
core.js:6260 ERROR Error: Uncaught (in promise): InteractionRequiredAuthError: AADSTS50058: A silent sign-in request was sent but no user is signed in. The cookies used to represent the user's session were not sent in the request to Azure AD. This can happen if the user is using Internet Explorer or Edge, and the web app sending the silent sign-in request is in different IE security zone than the Azure AD endpoint (login.microsoftonline.com).
Trace ID: 89abda01-6426-4658-8692-7690f74f8d00
Correlation ID: cf52e237-939c-4ce0-875b-d8a5555a0a13
Timestamp: 2020-05-17 20:42:55Z
InteractionRequiredAuthError: AADSTS50058: A silent sign-in request was sent but no user is signed in. The cookies used to represent the user's session were not sent in the request to Azure AD. This can happen if the user is using Internet Explorer or Edge, and the web app sending the silent sign-in request is in different IE security zone than the Azure AD endpoint (login.microsoftonline.com).
Trace ID: 89abda01-6426-4658-8692-7690f74f8d00
Correlation ID: cf52e237-939c-4ce0-875b-d8a5555a0a13
Timestamp: 2020-05-17 20:42:55Z
at InteractionRequiredAuthError.AuthError [as constructor] (AuthError.js:22)
at InteractionRequiredAuthError.ServerError [as constructor] (ServerError.js:22)
at new InteractionRequiredAuthError (InteractionRequiredAuthError.js:24)
at MsalService.push../node_modules/msal/lib-es6/UserAgentApplication.js.UserAgentApplication.saveTokenFromHash (UserAgentApplication.js:1289)
at MsalService.push../node_modules/msal/lib-es6/UserAgentApplication.js.UserAgentApplication.processCallBack (UserAgentApplication.js:845)
at MsalService.push../node_modules/msal/lib-es6/UserAgentApplication.js.UserAgentApplication.handleAuthenticationResponse (UserAgentApplication.js:897)
at MsalService.<anonymous> (UserAgentApplication.js:667)
at step (tslib.es6.js:100)
at Object.next (tslib.es6.js:81)
at fulfilled (tslib.es6.js:71)
at resolvePromise (zone-evergreen.js:798)
at resolvePromise (zone-evergreen.js:750)
at zone-evergreen.js:860
at ZoneDelegate.invokeTask (zone-evergreen.js:399)
at Object.onInvokeTask (core.js:41640)
at ZoneDelegate.invokeTask (zone-evergreen.js:398)
at Zone.runTask (zone-evergreen.js:167)
at drainMicroTaskQueue (zone-evergreen.js:569)
at invokeTask (zone-evergreen.js:484)
at ZoneTask.invoke (zone-evergreen.js:469)发布于 2020-05-18 04:43:07
你能把小提琴的痕迹包括进去吗?
来自指南:
这意味着用户没有被登录。这是一个常见的错误,当用户未经身份验证且尚未登录时,该错误是预期的。如果在用户先前登录的SSO上下文中遇到此错误,这意味着SSO会话要么未找到,要么无效。如果指定了prompt=none,则此错误可能返回给应用程序。
我还看到了这样的情况,如果有多个UPN显示给用户,而预期的UPN没有登录,那么也可以检查一下。
https://stackoverflow.com/questions/61858770
复制相似问题