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/hosting-model-configuration.md
+62-3Lines changed: 62 additions & 3 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 about Blazor hosting model configuration, including how to in
5
5
monikerRange: '>= aspnetcore-3.1'
6
6
ms.author: riande
7
7
ms.custom: mvc
8
-
ms.date: 03/24/2020
8
+
ms.date: 04/07/2020
9
9
no-loc: [Blazor, SignalR]
10
10
uid: blazor/hosting-model-configuration
11
11
---
@@ -19,14 +19,73 @@ This article covers hosting model configuration.
19
19
20
20
## Blazor WebAssembly
21
21
22
+
### Environment
23
+
24
+
When running an app locally, the environment defaults to Development. When the app is published, the environment defaults to Production.
25
+
26
+
A hosted Blazor WebAssembly app picks up the environment from the server via a middleware that communicates the environment to the browser by adding the `blazor-environment` header. The value of the header is the environment. The hosted Blazor app and the server app share the same environment. For more information, including how to configure the environment, see <xref:fundamentals/environments>.
27
+
28
+
For a standalone app running locally, the development server adds the `blazor-environment` header to specify the Development environment. To specify the environment for other hosting environments, add the `blazor-environment` header.
29
+
30
+
In the following example for IIS, add the custom header to the published *web.config* file. The *web.config* file is located in the *bin/Release/{TARGET FRAMEWORK}/publish* folder:
31
+
32
+
```xml
33
+
<?xml version="1.0" encoding="UTF-8"?>
34
+
<configuration>
35
+
<system.webServer>
36
+
37
+
...
38
+
39
+
<httpProtocol>
40
+
<customHeaders>
41
+
<addname="blazor-environment"value="Staging" />
42
+
</customHeaders>
43
+
</httpProtocol>
44
+
</system.webServer>
45
+
</configuration>
46
+
```
47
+
48
+
> [!NOTE]
49
+
> To use a custom *web.config* file for IIS that isn't overwritten when the app is published to the *publish* folder, see <xref:host-and-deploy/blazor/webassembly#use-a-custom-webconfig>.
50
+
51
+
Obtain the app's environment in a component by injecting `IWebAssemblyHostEnvironment` and reading the `Environment` property:
As of the ASP.NET Core 3.2 Preview 3 release, Blazor WebAssembly supports configuration from:
23
66
24
67
**wwwroot/appsettings.json*
25
68
**wwwroot/appsettings.{ENVIRONMENT}.json*
26
69
27
-
In a Blazor Hosted app, the [runtime environment](xref:fundamentals/environments) is the same as the server app's value.
70
+
Add an *appsettings.json* file in the *wwwroot* folder:
71
+
72
+
```json
73
+
{
74
+
"message": "Hello from config!"
75
+
}
76
+
```
77
+
78
+
Inject an <xref:Microsoft.Extensions.Configuration.IConfiguration> instance into a component to access the configuration data:
28
79
29
-
When running the app locally, the environment defaults to Development. When the app is published, the environment defaults to Production. For more information, including how to configure the environment, see <xref:fundamentals/environments>.
80
+
```razor
81
+
@page "/"
82
+
@using Microsoft.Extensions.Configuration
83
+
@inject IConfiguration Configuration
84
+
85
+
<h1>Configuration example</h1>
86
+
87
+
<p>Message: @Configuration["message"]</p>
88
+
```
30
89
31
90
> [!WARNING]
32
91
> Configuration in a Blazor WebAssembly app is visible to users. **Don't store app secrets or credentials in configuration.**
Copy file name to clipboardExpand all lines: aspnetcore/blazor/integrate-components.md
+14-1Lines changed: 14 additions & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -5,7 +5,7 @@ description: Learn about data binding scenarios for components and DOM elements
5
5
monikerRange: '>= aspnetcore-3.1'
6
6
ms.author: riande
7
7
ms.custom: mvc
8
-
ms.date: 03/17/2020
8
+
ms.date: 04/01/2020
9
9
no-loc: [Blazor, SignalR]
10
10
uid: blazor/integrate-components
11
11
---
@@ -105,6 +105,19 @@ To support routable Razor components in Razor Pages apps:
105
105
106
106
Components use the shared *_Layout.cshtml* file for their layout.
107
107
108
+
<xref:Microsoft.AspNetCore.Mvc.Rendering.RenderMode> configures whether the `App` component:
109
+
110
+
* Is prerendered into the page.
111
+
* Is rendered as static HTML on the page or if it includes the necessary information to bootstrap a Blazor app from the user agent.
112
+
113
+
| Render Mode | Description |
114
+
| ----------- | ----------- |
115
+
|<xref:Microsoft.AspNetCore.Mvc.Rendering.RenderMode.ServerPrerendered>| Renders the `App` component into static HTML and includes a marker for a Blazor Server app. When the user-agent starts, this marker is used to bootstrap a Blazor app. |
116
+
|<xref:Microsoft.AspNetCore.Mvc.Rendering.RenderMode.Server>| Renders a marker for a Blazor Server app. Output from the `App` component isn't included. When the user-agent starts, this marker is used to bootstrap a Blazor app. |
117
+
|<xref:Microsoft.AspNetCore.Mvc.Rendering.RenderMode.Static>| Renders the `App` component into static HTML. |
118
+
119
+
For more information on the Component Tag Helper, see <xref:mvc/views/tag-helpers/builtin-th/component-tag-helper>.
120
+
108
121
1. Add a low-priority route for the *_Host.cshtml* page to endpoint configuration in `Startup.Configure`:
The Microsoft Authentication Library (`Microsoft.Authentication.WebAssembly.Msal`) doesn't support [AAD B2C user flows](/azure/active-directory-b2c/user-flow-overview) by default. Create custom user flows in developer code.
4
+
5
+
For more information on how to build a challenge for a custom user flow, see [User flows in Azure Active Directory B2C](/azure/active-directory-b2c/user-flow-overview).
Routing is configured using the <xref:Microsoft.AspNetCore.Builder.EndpointRoutingApplicationBuilderExtensions.UseRouting*> and <xref:Microsoft.AspNetCore.Builder.EndpointRoutingApplicationBuilderExtensions.UseEndpoints*> middleware. To use controllers:
91
-
92
-
* Call <xref:Microsoft.AspNetCore.Builder.ControllerEndpointRouteBuilderExtensions.MapControllers*> inside `UseEndpoints` to map [attribute routed](#ar) controllers.
93
-
* Call <xref:Microsoft.AspNetCore.Builder.ControllerEndpointRouteBuilderExtensions.MapControllerRoute*> or <xref:Microsoft.AspNetCore.Builder.ControllerEndpointRouteBuilderExtensions.MapAreaControllerRoute*>, to map [conventionally routed](#cr) controllers.
90
+
> [!IMPORTANT]
91
+
> Routing is configured using the <xref:Microsoft.AspNetCore.Builder.EndpointRoutingApplicationBuilderExtensions.UseRouting*> and <xref:Microsoft.AspNetCore.Builder.EndpointRoutingApplicationBuilderExtensions.UseEndpoints*> middleware. To use controllers:
@@ -14,12 +14,25 @@ By [Daniel Roth](https://github.com/danroth27) and [Luke Latham](https://github.
14
14
15
15
To render a component from a page or view, use the [Component Tag Helper](xref:Microsoft.AspNetCore.Mvc.TagHelpers.ComponentTagHelper).
16
16
17
+
## Prerequisites
18
+
19
+
Follow the guidance in the *Prepare the app to use components in pages and views* section of the <xref:blazor/integrate-components#prepare-the-app-to-use-components-in-pages-and-views> article.
20
+
21
+
## Component Tag Helper
22
+
17
23
The following Component Tag Helper renders the `Counter` component in a page or view:
The preceding example assumes that the `Counter` component is in the app's *Pages* folder.
35
+
23
36
The Component Tag Helper can also pass parameters to components. Consider the following `ColorfulCheckbox` component that sets the check box label's color and size:
24
37
25
38
```razor
@@ -51,10 +64,17 @@ The Component Tag Helper can also pass parameters to components. Consider the fo
51
64
The `Size` (`int`) and `Color` (`string`) [component parameters](xref:blazor/components#component-parameters) can be set by the Component Tag Helper:
The preceding example assumes that the `ColorfulCheckbox` component is in the app's *Shared* folder.
77
+
58
78
The following HTML is rendered in the page or view:
59
79
60
80
```html
@@ -68,6 +88,60 @@ Passing a quoted string requires an [explicit Razor expression](xref:mvc/views/r
68
88
69
89
The parameter type must be JSON serializable, which typically means that the type must have a default constructor and settable properties. For example, you can specify a value for `Size` and `Color` in the preceding example because the types of `Size` and `Color` are primitive types (`int` and `string`), which are supported by the JSON serializer.
70
90
91
+
In the following example, a class object is passed to the component:
The preceding example assumes that the `MyComponent` component is in the app's *Shared* folder. `MyClass` is in the app's namespace (`{APP ASSEMBLY}`).
144
+
71
145
<xref:Microsoft.AspNetCore.Mvc.Rendering.RenderMode> configures whether the component:
0 commit comments