You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: aspnetcore/blazor/call-web-api.md
+22-6Lines changed: 22 additions & 6 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -5,7 +5,7 @@ description: Learn how to call a web API from Blazor apps.
5
5
monikerRange: '>= aspnetcore-3.1'
6
6
ms.author: riande
7
7
ms.custom: mvc
8
-
ms.date: 11/12/2024
8
+
ms.date: 04/29/2025
9
9
uid: blazor/call-web-api
10
10
---
11
11
# Call a web API from ASP.NET Core Blazor
@@ -20,6 +20,17 @@ The [`System.Net.Http.Json`](https://www.nuget.org/packages/System.Net.Http.Json
20
20
21
21
:::moniker range=">= aspnetcore-8.0"
22
22
23
+
## Use a token handler for web API calls
24
+
25
+
Blazor Web Apps with OIDC authentication can use a token handler approach to make outgoing requests to secure external web API calls. This approach is used by the `BlazorWebAppOidc` and `BlazorWebAppOidcServer` sample apps described in the next section.
26
+
27
+
For more information, see the following resources:
For working examples, see the following sample apps in the [Blazor samples GitHub repository (`dotnet/blazor-samples`)](https://github.com/dotnet/blazor-samples/) ([how to download](xref:blazor/fundamentals/index#sample-apps)).
@@ -37,7 +48,8 @@ For client-side rendering (CSR), which includes Interactive WebAssembly componen
@@ -108,7 +120,11 @@ The solution demonstrates calling a secure web API for the following:
108
120
109
121
### `BlazorWebAppOidc`
110
122
111
-
A Blazor Web App with global Auto interactivity that uses OIDC authentication with Microsoft Entra without using Entra-specific packages. The solution includes a demonstration of obtaining weather data securely via a web API when a component that adopts Interactive Auto rendering is rendered on the client.
123
+
A Blazor Web App with global Auto interactivity that uses OIDC authentication with Microsoft Entra without using Entra-specific packages. The sample demonstrates how to [use a token handler for web API calls](xref:blazor/security/additional-scenarios#use-a-token-handler-for-web-api-calls) to call an external secure web API.
124
+
125
+
### `BlazorWebAppOidcServer`
126
+
127
+
A Blazor Web App with global Interactive Server interactivity that uses OIDC authentication with Microsoft Entra without using Entra-specific packages. The sample demonstrates how to [pass an access token](xref:blazor/security/additional-scenarios#use-a-token-handler-for-web-api-calls) to call an external secure web API.
112
128
113
129
### `BlazorWebAppOidcBff`
114
130
@@ -117,15 +133,15 @@ A Blazor Web App with global Auto interactivity that uses:
117
133
* OIDC authentication with Microsoft Entra without using Entra-specific packages.
118
134
* The [Backend for Frontend (BFF) pattern](/azure/architecture/patterns/backends-for-frontends), which is a pattern of app development that creates backend services for frontend apps or interfaces.
119
135
120
-
The solution includes a demonstration of obtaining weather data securely via a web API when a component that adopts Interactive Auto rendering is rendered on the client.
136
+
The solution includes a demonstration of obtaining weather data securely via an external web API when a component that adopts Interactive Auto rendering is rendered on the client.
121
137
122
138
:::moniker-end
123
139
124
140
:::moniker range=">= aspnetcore-9.0"
125
141
126
142
### `BlazorWebAppEntra`
127
143
128
-
A Blazor Web App with global Auto interactivity that uses [Microsoft identity platform](/entra/identity-platform/)/[Microsoft Identity Web packages](/entra/msal/dotnet/microsoft-identity-web/) for [Microsoft Entra ID](https://www.microsoft.com/security/business/microsoft-entra). The solution includes a demonstration of obtaining weather data securely via a web API when a component that adopts Interactive Auto rendering is rendered on the client.
144
+
A Blazor Web App with global Auto interactivity that uses [Microsoft identity platform](/entra/identity-platform/)/[Microsoft Identity Web packages](/entra/msal/dotnet/microsoft-identity-web/) for [Microsoft Entra ID](https://www.microsoft.com/security/business/microsoft-entra). The solution includes a demonstration of obtaining weather data securely via an external web API when a component that adopts Interactive Auto rendering is rendered on the client.
129
145
130
146
### `BlazorWebAppEntraBff`
131
147
@@ -134,7 +150,7 @@ A Blazor Web App with global Auto interactivity that uses:
134
150
*[Microsoft identity platform](/entra/identity-platform/)/[Microsoft Identity Web packages](/entra/msal/dotnet/microsoft-identity-web/) for [Microsoft Entra ID](https://www.microsoft.com/security/business/microsoft-entra).
135
151
* The [Backend for Frontend (BFF) pattern](/azure/architecture/patterns/backends-for-frontends), which is a pattern of app development that creates backend services for frontend apps or interfaces.
136
152
137
-
The solution includes a demonstration of obtaining weather data securely via a web API when a component that adopts Interactive Auto rendering is rendered on the client.
153
+
The solution includes a demonstration of obtaining weather data securely via an external web API when a component that adopts Interactive Auto rendering is rendered on the client.
<xref:Microsoft.AspNetCore.Http.IHttpContextAccessor> generally should be avoided with interactive rendering because a valid <xref:Microsoft.AspNetCore.Http.HttpContext> isn't always available.
18
18
19
-
<xref:Microsoft.AspNetCore.Http.IHttpContextAccessor> can be used for components that are statically rendered on the server. **However, we recommend avoiding it if possible.**
19
+
<xref:Microsoft.AspNetCore.Http.IHttpContextAccessor> can be used during static server-side rendering (static SSR), for example in statically-rendered root components, and when [using a token handler for web API calls](xref:blazor/security/additional-scenarios#use-a-token-handler-for-web-api-calls)on the server. **We recommend avoiding <xref:Microsoft.AspNetCore.Http.IHttpContextAccessor> when static SSR or code running on the server can't be guaranteed.**
20
20
21
-
<xref:Microsoft.AspNetCore.Http.HttpContext> can be used as a [cascading parameter](xref:Microsoft.AspNetCore.Components.CascadingParameterAttribute) only in *statically-rendered root components*for general tasks, such as inspecting and modifying headers or other properties in the `App` component (`Components/App.razor`). The value is always `null`for interactive rendering.
21
+
<xref:Microsoft.AspNetCore.Http.HttpContext> can be used as a [cascading parameter](xref:Microsoft.AspNetCore.Components.CascadingParameterAttribute) only in statically-rendered root components or during static SSR for general tasks, such as inspecting and modifying headers or other properties in the `App` component (`App.razor`). The value is `null`during interactive rendering.
22
22
23
23
```csharp
24
24
[CascadingParameter]
25
25
publicHttpContext?HttpContext { get; set; }
26
26
```
27
27
28
-
During interactive rendering, an <xref:Microsoft.AspNetCore.Http.HttpContext> instance might not even exist. For scenarios where the <xref:Microsoft.AspNetCore.Http.HttpContext> is required in interactive components, we recommend flowing context data with [persistent component state](xref:blazor/components/prerender#persist-prerendered-state) from the server.
29
-
30
28
For additional context in *advanced* edge cases†, see the discussion in the following articles:
31
29
32
30
*[HttpContext is valid in Interactive Server Rendering Blazor page (`dotnet/AspNetCore.Docs`#34301)](https://github.com/dotnet/AspNetCore.Docs/issues/34301)
33
31
*[Security implications of using IHttpContextAccessor in Blazor Server (`dotnet/aspnetcore`#45699)](https://github.com/dotnet/aspnetcore/issues/45699)
34
32
35
-
†Most developers building and maintaining Blazor apps don't need to delve into advanced concepts as long as the general guidance in this article is followed.
33
+
†Most developers building and maintaining Blazor apps don't need to delve into advanced concepts when the general guidance in this article is followed. The most important concept to keep in mind is that <xref:Microsoft.AspNetCore.Http.HttpContext> is fundamentally a server-based, request-response feature that's only generally available on the server during static SSR and only created when a user's circuit is established.
0 commit comments