Question

Angular应用程序是此示例应用程序的修改版本： https://github.com/AzureAD/microsoft-authentication-library-for-js/tree/dev/samples/angular8-sample-app

使用MSAL，应用程序可以使用Azure AD B2C登录和注销。访问profile组件时，将显示以下错误：

错误错误：未捕获（承诺）：ServerError：AADB2C90117：不支持请求中提供的作用域'user.read'。

关联ID：fffc59f4-3c83-4d6c-b77a-c8f04939ead1
时间戳：2020-03-01 19：51：13Z
ServerError：AADB2C90117：不支持请求中提供的范围“ user.read”。
相关ID：fffc59f4-3c83-4d6c-b77a-c8f04939ead1
时间戳：2020-03-01 19：51：13Z

app.module.ts ：

import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { NgModule } from '@angular/core';

import { MatToolbarModule, MatButtonModule, MatListModule } from '@angular/material';

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';

export const protectedResourceMap: [string, string[]][] = [
  ['https://tenantname.onmicrosoft.com/api', ['user.read']]
];

const isIE = window.navigator.userAgent.indexOf("MSIE ") > -1 || window.navigator.userAgent.indexOf("Trident/") > -1;

@NgModule({
  declarations: [
    AppComponent,
    ProfileComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    BrowserAnimationsModule,
    HttpClientModule,
    MatToolbarModule,
    MatButtonModule,
    MatListModule,
    AppRoutingModule,
    MsalModule.forRoot({
      auth: {
        clientId: 'first-b2c-application-id',
        authority: "https://tenantname.b2clogin.com/tenantname.onmicrosoft.com/b2c_1_signupsignin1",
        validateAuthority: false,
        redirectUri: "http://localhost:4200/",
        postLogoutRedirectUri: "http://localhost:4200/",
        navigateToLoginRequestUrl: true,
      },
      cache: {
        cacheLocation: "localStorage",
        storeAuthStateInCookie: isIE, // set to true for IE 11
      },
    },
    {
      popUp: !isIE,
      consentScopes: [
        "user.read",
        "openid",
        "profile"
      ],
      unprotectedResources: ["https://www.microsoft.com/en-us/"],
      protectedResourceMap,
      extraQueryParameters: {}
    })
  ],
  providers: [
    {
      provide: HTTP_INTERCEPTORS,
      useClass: MsalInterceptor,
      multi: true
    }
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

profile.component.ts

import { Component, OnInit } from '@angular/core';
import { MsalService } from '@azure/msal-angular';
import { HttpClient } from '@angular/common/http';

const GRAPH_ENDPOINT = 'https://my-tenant.onmicrosoft.com/api';

@Component({
  selector: 'app-profile',
  templateUrl: './profile.component.html',
  styleUrls: ['./profile.component.css']
})
export class ProfileComponent implements OnInit {
  profile;

  constructor(private authService: MsalService, private http: HttpClient) { }

  ngOnInit() {
    this.getProfile();
  }

  getProfile() {
    this.http.get(GRAPH_ENDPOINT)
      .toPromise().then(profile => {
        this.profile = profile;
      });
  }

}

Web API发布范围（第二个Azure AD B2C应用程序）

user.read
user.write

Answer 1

当前，使用Azure AD B2C发行的令牌（即使用由于内置Azure AD B2C或自定义流而发行的令牌）不支持访问任何Microsoft API。

相反，要使单页应用程序访问Microsoft Graph API，必须使用代理API桥接它们。

Azure AD B2C：请求中提供的范围“ user.read”不受支持

1 个答案: