diff --git a/aspnetcore/blazor/hosting-model-configuration.md b/aspnetcore/blazor/hosting-model-configuration.md index 2dbab74532..64435cd218 100644 --- a/aspnetcore/blazor/hosting-model-configuration.md +++ b/aspnetcore/blazor/hosting-model-configuration.md @@ -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 . + +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 + + + + + ... + + + + + + + + +``` + +> [!NOTE] +> To use a custom *web.config* file for IIS that isn't overwritten when the app is published to the *publish* folder, see . + +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 + +

Environment example

+ +

Environment: @HostEnvironment.Environment

+``` + +### 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 . +```json +{ + "message": "Hello from config!" +} +``` + +Inject an instance into a component to access the configuration data: + +```razor +@page "/" +@using Microsoft.Extensions.Configuration +@inject IConfiguration Configuration + +

Configuration example

+ +

Message: @Configuration["message"]

+``` > [!WARNING] > Configuration in a Blazor WebAssembly app is visible to users. **Don't store app secrets or credentials in configuration.** diff --git a/aspnetcore/blazor/integrate-components.md b/aspnetcore/blazor/integrate-components.md index 336186f395..3edade0c0b 100644 --- a/aspnetcore/blazor/integrate-components.md +++ b/aspnetcore/blazor/integrate-components.md @@ -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. + 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 | + | ----------- | ----------- | + | | 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. | + | | 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. | + | | Renders the `App` component into static HTML. | + + For more information on the Component Tag Helper, see . + 1. Add a low-priority route for the *_Host.cshtml* page to endpoint configuration in `Startup.Configure`: ```csharp diff --git a/aspnetcore/includes/blazor-security/wasm-aad-b2c-userflows.md b/aspnetcore/includes/blazor-security/wasm-aad-b2c-userflows.md new file mode 100644 index 0000000000..4ee558fcff --- /dev/null +++ b/aspnetcore/includes/blazor-security/wasm-aad-b2c-userflows.md @@ -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). diff --git a/aspnetcore/mvc/controllers/routing.md b/aspnetcore/mvc/controllers/routing.md index 9bdf38a301..c80b23fc92 100644 --- a/aspnetcore/mvc/controllers/routing.md +++ b/aspnetcore/mvc/controllers/routing.md @@ -87,10 +87,11 @@ Replaces: endpoints.MapControllerRoute("default", "{controller=Home}/{action=Index}/{id?}"); ``` -Routing is configured using the and middleware. To use controllers: - -* Call inside `UseEndpoints` to map [attribute routed](#ar) controllers. -* Call or , to map [conventionally routed](#cr) controllers. +> [!IMPORTANT] +> Routing is configured using the and middleware. To use controllers: +> +> * Call inside `UseEndpoints` to map [attribute routed](#ar) controllers. +> * Call or , to map [conventionally routed](#cr) controllers. diff --git a/aspnetcore/mvc/views/tag-helpers/built-in/component-tag-helper.md b/aspnetcore/mvc/views/tag-helpers/built-in/component-tag-helper.md index 704261e511..a7e3ea21c6 100644 --- a/aspnetcore/mvc/views/tag-helpers/built-in/component-tag-helper.md +++ b/aspnetcore/mvc/views/tag-helpers/built-in/component-tag-helper.md @@ -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 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 + +... + ``` +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 + +... + ``` +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 +

MyComponent

+ +

Int: @MyObject.MyInt

+

String: @MyObject.MyString

+ +@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"; +} + + +``` + +The preceding example assumes that the `MyComponent` component is in the app's *Shared* folder. `MyClass` is in the app's namespace (`{APP ASSEMBLY}`). + configures whether the component: * Is prerendered into the page. diff --git a/aspnetcore/security/blazor/webassembly/hosted-with-azure-active-directory-b2c.md b/aspnetcore/security/blazor/webassembly/hosted-with-azure-active-directory-b2c.md index d737cae550..d1f8fd011c 100644 --- a/aspnetcore/security/blazor/webassembly/hosted-with-azure-active-directory-b2c.md +++ b/aspnetcore/security/blazor/webassembly/hosted-with-azure-active-directory-b2c.md @@ -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 + +[!INCLUDE[](~/includes/blazor-security/wasm-aad-b2c-userflows.md)] + [!INCLUDE[](~/includes/blazor-security/troubleshoot.md)] ## Additional resources diff --git a/aspnetcore/security/blazor/webassembly/standalone-with-azure-active-directory-b2c.md b/aspnetcore/security/blazor/webassembly/standalone-with-azure-active-directory-b2c.md index b04a2f761f..ac073cb49c 100644 --- a/aspnetcore/security/blazor/webassembly/standalone-with-azure-active-directory-b2c.md +++ b/aspnetcore/security/blazor/webassembly/standalone-with-azure-active-directory-b2c.md @@ -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