A web app that calls web APIs: Call a web API

When you use Microsoft.Identity.Web, you have three usage options for calling an API:

• Option 1: Call Microsoft Graph with the Microsoft Graph SDK
• Option 2: Call a downstream web API with the helper class
• Option 3: Call a downstream web API without the helper class

In this scenario, you call Microsoft Graph by adding the Microsoft.Identity.Web.GraphServiceClient NuGet package and including .AddMicrosoftGraph() in Startup.cs as specified in Code configuration. You can then directly inject the GraphServiceClient into your controller or page constructor to use it in the actions. The following example Razor page displays the photo of the signed-in user.

[Authorize]
[AuthorizeForScopes(Scopes = new[] { "https://microsoftgraph.chinacloudapi.cn/user.read" })]
public class IndexModel : PageModel
{
 private readonly GraphServiceClient _graphServiceClient;

 public IndexModel(GraphServiceClient graphServiceClient)
 {
    _graphServiceClient = graphServiceClient;
 }

 public async Task OnGet()
 {
  var user = await _graphServiceClient.Me.GetAsync();
  try
  {
   using (var photoStream = await _graphServiceClient.Me.Photo.Content.GetAsync())
   {
    byte[] photoByte = ((MemoryStream)photoStream).ToArray();
    ViewData["photo"] = Convert.ToBase64String(photoByte);
   }
   ViewData["name"] = user.DisplayName;
  }
  catch (Exception)
  {
   ViewData["photo"] = null;
  }
 }
}

For a full sample, see ASP.NET Core web app that calls Microsoft Graph.

You want to call a web API other than Microsoft Graph. In that case, you add AddDownstreamApi in Startup.cs as specified in Code configuration, and you can directly inject an IDownstreamApi service in your controller or page constructor and use it in the actions:

[Authorize]
[AuthorizeForScopes(ScopeKeySection = "TodoList:Scopes")]
public class TodoListController : Controller
{
  private IDownstreamApi _downstreamApi;
  private const string ServiceName = "TodoList";

  public TodoListController(IDownstreamApi downstreamApi)
  {
    _downstreamApi = downstreamApi;
  }

  public async Task<ActionResult> Details(int id)
  {
    var value = await _downstreamApi.CallApiForUserAsync(
      ServiceName,
      options =>
      {
        options.RelativePath = $"me";
      });
      return View(value);
  }
}

The CallWebApiForUserAsync also has strongly typed generic overrides that enable you to directly receive an object. For example, the following method receives a Todo instance, which is a strongly typed representation of the JSON returned by the web API.

    // GET: TodoList/Details/5
    public async Task<ActionResult> Details(int id)
    {
        var value = await _downstreamApi.CallApiForUserAsync<object, Todo>(
            ServiceName,
            null,
            options =>
            {
                options.HttpMethod = HttpMethod.Get;
                options.RelativePath = $"api/todolist/{id}";
            });
        return View(value);
    }

For a full sample, see ASP.NET Core web app that calls an API

You've decided to acquire a token manually using the IAuthorizationHeaderProvider service, and you now need to use the token. In that case, the following code continues the example code shown in A web app that calls web APIs: Acquire a token for the app. The code is called in the actions of the web app controllers.

After you've acquired the token, use it as a bearer token to call the downstream API, in this case Microsoft Graph.

public async Task<IActionResult> Profile()
{
  // Acquire the access token.
 string[] scopes = new string[]{"https://microsoftgraph.chinacloudapi.cn/user.read"};
  string authorizationHeader = await IAuthorizationHeaderProvider.GetAuthorizationHeaderForUserAsync(scopes);

  // Use the access token to call a protected web API.
  HttpClient httpClient = new HttpClient();
  client.DefaultRequestHeaders.Add("Authorization", authorizationHeader);

  var response = await httpClient.GetAsync($"{webOptions.GraphApiUrl}/beta/me");

  if (response.StatusCode == HttpStatusCode.OK)
  {
    var content = await response.Content.ReadAsStringAsync();

    dynamic me = JsonConvert.DeserializeObject(content);
    ViewData["Me"] = me;
  }

  return View();
}

When you use Microsoft.Identity.Web, you have three usage options for calling an API:

• Option 1: Call Microsoft Graph with the Microsoft Graph SDK
• Option 2: Call a downstream web API with the helper class
• Option 3: Call a downstream web API without the helper class

You want to call Microsoft Graph. In this scenario, you've added AddMicrosoftGraph in Startup.cs as specified in Code configuration, and you can get the GraphServiceClient in your controller or page constructor for use in the actions by using the GetGraphServiceClient() extension method on the controller. The following example displays the photo of the signed-in user.

[Authorize]
[AuthorizeForScopes(Scopes = new[] { "https://microsoftgraph.chinacloudapi.cn/user.read" })]
public class HomeController : Controller
{

 public async Task GetIndex()
 {
  var graphServiceClient = this.GetGraphServiceClient();
  var user = await graphServiceClient.Me.GetAsync();
  try
  {
   using (var photoStream = await graphServiceClient.Me.Photo.Content.GetAsync())
   {
    byte[] photoByte = ((MemoryStream)photoStream).ToArray();
    ViewData["photo"] = Convert.ToBase64String(photoByte);
   }
   ViewData["name"] = user.DisplayName;
  }
  catch (Exception)
  {
   ViewData["photo"] = null;
  }
 }
}

For a full sample, see ASP.NET OWIN Web app that calls Microsoft Graph

You want to call a web API other than Microsoft Graph. In that case, you've added AddDownstreamApi in Startup.cs as specified in Code configuration, and you can get IDownstreamApi service in your controller by calling the GetDownstreamApi extension method on the controller:

[Authorize]
public class TodoListController : Controller
{ 
  public async Task<ActionResult> Details(int id)
  {
    var downstreamApi = this.GetDownstreamApi();
    var value = await downstreamApi.CallApiForUserAsync(
      ServiceName,
      options =>
      {
        options.RelativePath = $"me";
      });
      return View(value);
  }
}

The CallApiForUserAsync also has strongly typed generic overrides that enable you to directly receive an object. For example, the following method receives a Todo instance, which is a strongly typed representation of the JSON returned by the web API.

    // GET: TodoList/Details/5
    public async Task<ActionResult> Details(int id)
    {
        var downstreamApi = this.GetDownstreamApi();
        var value = await downstreamApi.CallApiForUserAsync<object, Todo>(
            ServiceName,
            null,
            options =>
            {
                options.HttpMethod = HttpMethod.Get;
                options.RelativePath = $"api/todolist/{id}";
            });
        return View(value);
    }

You've decided to acquire an authorization header using the IAuthorizationHeaderProvider service, and you now need to use it in your HttpClient or HttpRequest. In that case, the following code continues the example code shown in A web app that calls web APIs: Acquire a token for the app. The code is called in the actions of the web app controllers.

public async Task<IActionResult> Profile()
{
  // Acquire the access token.
  string[] scopes = new string[]{"https://microsoftgraph.chinacloudapi.cn/user.read"};
  var IAuthorizationHeaderProvider = this.GetAuthorizationHeaderProvider();
  string authorizationHeader = await IAuthorizationHeaderProvider.GetAuthorizationHeaderForUserAsync(scopes);

  // Use the access token to call a protected web API.
  HttpClient httpClient = new HttpClient();
  client.DefaultRequestHeaders.Add("Authorization", authorizationHeader);

  var response = await httpClient.GetAsync($"{webOptions.GraphApiUrl}/beta/me");

  if (response.StatusCode == HttpStatusCode.OK)
  {
    var content = await response.Content.ReadAsStringAsync();

    dynamic me = JsonConvert.DeserializeObject(content);
    ViewData["Me"] = me;
  }

  return View();
}

private String getUserInfoFromGraph(String accessToken) throws Exception {
    // Microsoft Graph user endpoint
    URL url = new URL("https://microsoftgraph.chinacloudapi.cn/v1.0/me");

    HttpURLConnection conn = (HttpURLConnection) url.openConnection();

    // Set the appropriate header fields in the request header.
    conn.setRequestProperty("Authorization", "Bearer " + accessToken);
    conn.setRequestProperty("Accept", "application/json");

    String response = HttpClientHelper.getResponseStringFromConn(conn);

    int responseCode = conn.getResponseCode();
    if(responseCode != HttpURLConnection.HTTP_OK) {
        throw new IOException(response);
    }

    JSONObject responseObject = HttpClientHelper.processResponse(responseCode, response);
    return responseObject.toString();
}

After successfully retrieving a token, the code uses the axios package to query the API endpoint and retrieve a JSON result.

/**
 * Attaches a given access token to a MS Graph API call
 * @param endpoint: REST API endpoint to call
 * @param accessToken: raw access token string
 */
async function fetch(endpoint, accessToken) {
    const options = {
        headers: {
            Authorization: `Bearer ${accessToken}`
        }
    };

    console.log(`request made to ${endpoint} at: ` + new Date().toString());

    try {
        const response = await axios.get(endpoint, options);
        return await response.data;
    } catch (error) {
        throw new Error(error);
    }
}

After successfully retrieving a token, the code uses the requests package to query the API endpoint and retrieve a JSON result.

@app.route("/call_downstream_api")
def call_downstream_api():
    token = auth.get_token_for_user(app_config.SCOPE)
    if "error" in token:
        return redirect(url_for("login"))
    # Use access token to call downstream api
    api_result = requests.get(
        app_config.ENDPOINT,
        headers={'Authorization': 'Bearer ' + token['access_token']},
        timeout=30,
    ).json()
    return render_template('display.html', result=api_result)