c# - אימות OAuth2 נכשל כאשר קריאת API של .net core נכשלה באמצעות Msal.js באפליקציית ווב React-Typescript

יש לי יישום ווב בצד הלקוח ב-Typescript React שצריך לתקשר עם API של .net core. בצד הלקוח הושלב msal.js. אני מצליח להתחבר ל-AAD, לקבל את חשבון המשתמש ואת אסימון הגישה ולהעביר אותו כ-Bearer לקריאת ה-API. עם זאת, האימות ברמת ה-API נכשל.

על הלקוח:

config: Msal.Configuration = buildConfiguration({ auth: {
        clientId: 'clientId',
        authority: 'authority',
        validateAuthority: true,
        navigateToLoginRequestUrl: false
    } });

 request = {
        scopes: ["user.read"] 
     };

    userAgentApp : Msal.UserAgentApplication = new Msal.UserAgentApplication(this.config);

private _accessToken: string = '';
    public async GetAccessToken(): Promise<string>{
        if(this._accessToken == '')
        {
            await this.userAgentApp.acquireTokenSilent(this.request)
                .then((tokenResponse) => this._accessToken = tokenResponse.accessToken)
                .catch((error) => console.log(error))
        }

        return this._accessToken;
    }

    public login() {
        console.log("before login");

        this.userAgentApp.handleRedirectCallback((error, response) => 
        { 
            console.error(error)
        });

        this.userAgentApp.loginRedirect(this.request);

        console.log("after login")
    }

// Calling the api
  axios.defaults.headers.common = {'Authorization': `Bearer ${accessToken}`}
      const travelExpensesResponse = await axios.get("https://localhost:44350/api/reisekostenantrag")

על Api

// Start.cs ConfigureServices
  services.AddAuthentication(sharedOptions =>
            {
                sharedOptions.DefaultScheme = JwtBearerDefaults.AuthenticationScheme;
            })
 .AddJwtBearer(options =>
            {
                options.Audience = "clientId";
                options.Authority = "authority";
            });

אני מקבל חריגת SecurityTokenInvalidSignatureException: IDX10511: אימות החתימה נכשל.

1. איפה יכול להיות הבעיה?
2. האם יש דוגמאות שמראות כיצד אפשר להעביר אסימון ל-API של .NET Core מאפליקציית לקוח?

תשובה #1

הבעיה הייתה שהאסימון ניתן את הטווח הזה user.read שהוא טווח של Graph API.

אז הפתרון היה לרשום את אפליקציית השרת באז'ור וליצור תחום מותאם אישית.

אז באפליקציה של הלקוח:

 request = {
        scopes: ["api://clientid/access_as_user"] 
     };