Merge pull request #17726 from dotnet/master

pull/18135/head^2
Luke Latham 2020-04-10 07:33:49 -05:00 committed by GitHub
commit e8dc30453a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 168 additions and 11 deletions

View File

@ -5,7 +5,7 @@ description: Learn about Blazor hosting model configuration, including how to in
monikerRange: '>= aspnetcore-3.1'
ms.author: riande
ms.custom: mvc
ms.date: 03/24/2020
ms.date: 04/07/2020
no-loc: [Blazor, SignalR]
uid: blazor/hosting-model-configuration
---
@ -19,14 +19,73 @@ This article covers hosting model configuration.
## Blazor WebAssembly
### Environment
When running an app locally, the environment defaults to Development. When the app is published, the environment defaults to Production.
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>.
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.
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:
```xml
<?xml version="1.0" encoding="UTF-8"?>
<configuration>
<system.webServer>
...
<httpProtocol>
<customHeaders>
<add name="blazor-environment" value="Staging" />
</customHeaders>
</httpProtocol>
</system.webServer>
</configuration>
```
> [!NOTE]
> 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>.
Obtain the app's environment in a component by injecting `IWebAssemblyHostEnvironment` and reading the `Environment` property:
```razor
@page "/"
@using Microsoft.AspNetCore.Components.WebAssembly.Hosting
@inject IWebAssemblyHostEnvironment HostEnvironment
<h1>Environment example</h1>
<p>Environment: @HostEnvironment.Environment</p>
```
### Configuration
As of the ASP.NET Core 3.2 Preview 3 release, Blazor WebAssembly supports configuration from:
* *wwwroot/appsettings.json*
* *wwwroot/appsettings.{ENVIRONMENT}.json*
In a Blazor Hosted app, the [runtime environment](xref:fundamentals/environments) is the same as the server app's value.
Add an *appsettings.json* file in the *wwwroot* folder:
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>.
```json
{
"message": "Hello from config!"
}
```
Inject an <xref:Microsoft.Extensions.Configuration.IConfiguration> instance into a component to access the configuration data:
```razor
@page "/"
@using Microsoft.Extensions.Configuration
@inject IConfiguration Configuration
<h1>Configuration example</h1>
<p>Message: @Configuration["message"]</p>
```
> [!WARNING]
> Configuration in a Blazor WebAssembly app is visible to users. **Don't store app secrets or credentials in configuration.**

View File

@ -5,7 +5,7 @@ description: Learn about data binding scenarios for components and DOM elements
monikerRange: '>= aspnetcore-3.1'
ms.author: riande
ms.custom: mvc
ms.date: 03/17/2020
ms.date: 04/01/2020
no-loc: [Blazor, SignalR]
uid: blazor/integrate-components
---
@ -105,6 +105,19 @@ To support routable Razor components in Razor Pages apps:
Components use the shared *_Layout.cshtml* file for their layout.
<xref:Microsoft.AspNetCore.Mvc.Rendering.RenderMode> configures whether the `App` component:
* Is prerendered into the page.
* Is rendered as static HTML on the page or if it includes the necessary information to bootstrap a Blazor app from the user agent.
| Render Mode | Description |
| ----------- | ----------- |
| <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. |
| <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. |
| <xref:Microsoft.AspNetCore.Mvc.Rendering.RenderMode.Static> | Renders the `App` component into static HTML. |
For more information on the Component Tag Helper, see <xref:mvc/views/tag-helpers/builtin-th/component-tag-helper>.
1. Add a low-priority route for the *_Host.cshtml* page to endpoint configuration in `Startup.Configure`:
```csharp

View File

@ -0,0 +1,5 @@
## Custom user flows
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.
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).

View File

@ -87,10 +87,11 @@ Replaces:
endpoints.MapControllerRoute("default", "{controller=Home}/{action=Index}/{id?}");
```
Routing is configured using the <xref:Microsoft.AspNetCore.Builder.EndpointRoutingApplicationBuilderExtensions.UseRouting*> and <xref:Microsoft.AspNetCore.Builder.EndpointRoutingApplicationBuilderExtensions.UseEndpoints*> middleware. To use controllers:
* Call <xref:Microsoft.AspNetCore.Builder.ControllerEndpointRouteBuilderExtensions.MapControllers*> inside `UseEndpoints` to map [attribute routed](#ar) controllers.
* Call <xref:Microsoft.AspNetCore.Builder.ControllerEndpointRouteBuilderExtensions.MapControllerRoute*> or <xref:Microsoft.AspNetCore.Builder.ControllerEndpointRouteBuilderExtensions.MapAreaControllerRoute*>, to map [conventionally routed](#cr) controllers.
> [!IMPORTANT]
> Routing is configured using the <xref:Microsoft.AspNetCore.Builder.EndpointRoutingApplicationBuilderExtensions.UseRouting*> and <xref:Microsoft.AspNetCore.Builder.EndpointRoutingApplicationBuilderExtensions.UseEndpoints*> middleware. To use controllers:
>
> * Call <xref:Microsoft.AspNetCore.Builder.ControllerEndpointRouteBuilderExtensions.MapControllers*> inside `UseEndpoints` to map [attribute routed](#ar) controllers.
> * Call <xref:Microsoft.AspNetCore.Builder.ControllerEndpointRouteBuilderExtensions.MapControllerRoute*> or <xref:Microsoft.AspNetCore.Builder.ControllerEndpointRouteBuilderExtensions.MapAreaControllerRoute*>, to map [conventionally routed](#cr) controllers.
<a name="routing-conventional-ref-label"></a>
<a name="crd"></a>

View File

@ -4,7 +4,7 @@ author: guardrex
ms.author: riande
description: Learn how to use the ASP.NET Core Component Tag Helper to render Razor components in pages and views.
ms.custom: mvc
ms.date: 03/18/2020
ms.date: 04/01/2020
no-loc: [Blazor, SignalR]
uid: mvc/views/tag-helpers/builtin-th/component-tag-helper
---
@ -14,12 +14,25 @@ By [Daniel Roth](https://github.com/danroth27) and [Luke Latham](https://github.
To render a component from a page or view, use the [Component Tag Helper](xref:Microsoft.AspNetCore.Mvc.TagHelpers.ComponentTagHelper).
## Prerequisites
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.
## Component Tag Helper
The following Component Tag Helper renders the `Counter` component in a page or view:
```cshtml
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@using {APP ASSEMBLY}.Pages
...
<component type="typeof(Counter)" render-mode="ServerPrerendered" />
```
The preceding example assumes that the `Counter` component is in the app's *Pages* folder.
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:
```razor
@ -51,10 +64,17 @@ The Component Tag Helper can also pass parameters to components. Consider the fo
The `Size` (`int`) and `Color` (`string`) [component parameters](xref:blazor/components#component-parameters) can be set by the Component Tag Helper:
```cshtml
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@using {APP ASSEMBLY}.Shared
...
<component type="typeof(ColorfulCheckbox)" render-mode="ServerPrerendered"
param-Size="14" param-Color="@("blue")" />
```
The preceding example assumes that the `ColorfulCheckbox` component is in the app's *Shared* folder.
The following HTML is rendered in the page or view:
```html
@ -68,6 +88,60 @@ Passing a quoted string requires an [explicit Razor expression](xref:mvc/views/r
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.
In the following example, a class object is passed to the component:
*MyClass.cs*:
```csharp
public class MyClass
{
public MyClass()
{
}
public int MyInt { get; set; } = 999;
public string MyString { get; set; } = "Initial value";
}
```
**The class must have a public parameterless constructor.**
*Shared/MyComponent.razor*:
```razor
<h2>MyComponent</h2>
<p>Int: @MyObject.MyInt</p>
<p>String: @MyObject.MyString</p>
@code
{
[Parameter]
public MyClass MyObject { get; set; }
}
```
*Pages/MyPage.cshtml*:
```cshtml
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@using {APP ASSEMBLY}
@using {APP ASSEMBLY}.Shared
...
@{
var myObject = new MyClass();
myObject.MyInt = 7;
myObject.MyString = "Set by MyPage";
}
<component type="typeof(MyComponent)" render-mode="ServerPrerendered"
param-MyObject="@myObject" />
```
The preceding example assumes that the `MyComponent` component is in the app's *Shared* folder. `MyClass` is in the app's namespace (`{APP ASSEMBLY}`).
<xref:Microsoft.AspNetCore.Mvc.Rendering.RenderMode> configures whether the component:
* Is prerendered into the page.

View File

@ -5,7 +5,7 @@ description:
monikerRange: '>= aspnetcore-3.1'
ms.author: riande
ms.custom: mvc
ms.date: 04/08/2020
ms.date: 04/09/2020
no-loc: [Blazor, SignalR]
uid: security/blazor/webassembly/hosted-with-azure-active-directory-b2c
---
@ -297,6 +297,9 @@ Run the app from the Server project. When using Visual Studio, select the Server
<!-- HOLD
[!INCLUDE[](~/includes/blazor-security/usermanager-signinmanager.md)]
-->
[!INCLUDE[](~/includes/blazor-security/wasm-aad-b2c-userflows.md)]
[!INCLUDE[](~/includes/blazor-security/troubleshoot.md)]
## Additional resources

View File

@ -5,7 +5,7 @@ description:
monikerRange: '>= aspnetcore-3.1'
ms.author: riande
ms.custom: mvc
ms.date: 04/08/2020
ms.date: 04/09/2020
no-loc: [Blazor, SignalR]
uid: security/blazor/webassembly/standalone-with-azure-active-directory-b2c
---
@ -133,6 +133,8 @@ For more information, see <xref:security/blazor/webassembly/additional-scenarios
[!INCLUDE[](~/includes/blazor-security/authentication-component.md)]
[!INCLUDE[](~/includes/blazor-security/wasm-aad-b2c-userflows.md)]
[!INCLUDE[](~/includes/blazor-security/troubleshoot.md)]
## Additional resources