如何在.net核心项目中从javascript调用microsoft graph api

Question

I have .net core project, where I need to call microsoft graph api. I already login and authenticated. But in some pages I need to fetch meeting room status and I need to call it from javascript to access token. I am following this tutorial but it not working: https://learn.microsoft.com/en-us/graph/tutorials/javascript?tutorial-step=1

I am getting error at below lines:

 try {
            authResult = await msalClient.ssoSilent(msalRequest);

        } catch (err) {

            authResult = await msalClient.loginPopup(msalRequest).catch(error => {
                // handle error
            });

        }

Answer 1

I assume you have an asp.net core MVC project and has integrate azure ad to let users sign in.

Then it means you realized the authentication in the server side, so if you need to call graph api in your client side, then you have to generate access token in the server side and then send the token to your page. This is my idea and here my test.

Controller:

using Microsoft.AspNetCore.Mvc;
using Microsoft.Extensions.Logging;
using System;
using System.Collections.Generic;
using System.Diagnostics;
using System.Linq;
using System.Threading.Tasks;
using WebMvcApp.Models;
using Microsoft.AspNetCore.Authorization;
using Microsoft.Identity.Web;

namespace WebMvcApp.Controllers
{
    [Authorize]
    public class HomeController : Controller
    {
        private readonly ITokenAcquisition _tokenAcquisition;
        private readonly ILogger<HomeController> _logger;

        public HomeController(ILogger<HomeController> logger, ITokenAcquisition tokenAcquisition)
        {
            _logger = logger;
            _tokenAcquisition = tokenAcquisition;
        }

        public async Task<IActionResult> IndexAsync()
        {
            string[] scopes = new string[] { "user.read" };
            string accessToken = await _tokenAcquisition.GetAccessTokenForUserAsync(scopes);

            return View();
        }
    }
}

appsettings.json

"AzureAd": {
    "Instance": "https://login.microsoftonline.com/",
    "Domain": "your_tenant_name.onmicrosoft.com",
    "TenantId": "tenant_id",
    "ClientId": "azure_ad_app_clientid",
    "ClientSecret": "client_secret",
    "CallbackPath": "/signin-oidc",
    "SignedOutCallbackPath ": "/signout-callback-oidc"
  }

StartUp.cs

using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.Mvc.Authorization;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.Extensions.Hosting;
using Microsoft.Identity.Web;
using Microsoft.Identity.Web.UI;

public void ConfigureServices(IServiceCollection services)
{
    services.AddMicrosoftIdentityWebAppAuthentication(Configuration)
        .EnableTokenAcquisitionToCallDownstreamApi(new string[] { "user.read" })
        .AddInMemoryTokenCaches();
    services.AddControllersWithViews(options =>
    {
        var policy = new AuthorizationPolicyBuilder()
            .RequireAuthenticatedUser()
            .Build();
        options.Filters.Add(new AuthorizeFilter(policy));
    }).AddMicrosoftIdentityUI();
}

and pls don't forget app.UseAuthentication(); in Configure method.

Then add login page _LoginPartial.cshtml and add it to layout:

@using System.Security.Principal

<ul class="navbar-nav">
@if (User.Identity.IsAuthenticated)
{
        <li class="nav-item">
            <span class="navbar-text text-dark">Hello @User.Identity.Name!</span>
        </li>
        <li class="nav-item">
            <a class="nav-link text-dark" asp-area="MicrosoftIdentity" asp-controller="Account" asp-action="SignOut">Sign out</a>
        </li>
}
else
{
        <li class="nav-item">
            <a class="nav-link text-dark" asp-area="MicrosoftIdentity" asp-controller="Account" asp-action="SignIn">Sign in</a>
        </li>
}
</ul>