From 31d13ac5b0fc1eef61096498bf35fe7d019ce114 Mon Sep 17 00:00:00 2001
From: guardrex <1622880+guardrex@users.noreply.github.com>
Date: Mon, 2 Aug 2021 05:24:12 -0500
Subject: [PATCH 1/3] Blazor _Host to _Layout updates
---
.../6.0/blazor/components/class-libraries.md | 2 +-
.../6.0/blazor/components/css-isolation.md | 4 ++--
.../6.0/blazor/components/event-handling.md | 6 +++---
.../components/prerendering-and-integration.md | 12 ++++--------
.../6.0/blazor/fundamentals/handle-errors.md | 2 +-
aspnetcore/6.0/blazor/fundamentals/routing.md | 4 ++--
aspnetcore/6.0/blazor/fundamentals/signalr.md | 14 +++++++-------
aspnetcore/6.0/blazor/fundamentals/startup.md | 2 +-
.../6.0/blazor/globalization-localization.md | 6 +++---
aspnetcore/6.0/blazor/host-and-deploy/index.md | 6 +++---
aspnetcore/6.0/blazor/includes/prerendering.md | 4 ++--
.../call-dotnet-from-javascript.md | 10 +++++-----
.../call-javascript-from-dotnet.md | 16 ++++++++--------
.../blazor/javascript-interoperability/index.md | 8 ++++----
aspnetcore/6.0/blazor/project-structure.md | 3 ++-
.../blazor/security/content-security-policy.md | 2 +-
.../security/server/additional-scenarios.md | 2 +-
aspnetcore/6.0/blazor/state-management.md | 6 ++++++
18 files changed, 56 insertions(+), 53 deletions(-)
diff --git a/aspnetcore/6.0/blazor/components/class-libraries.md b/aspnetcore/6.0/blazor/components/class-libraries.md
index 82939e244542..fa3b22934258 100644
--- a/aspnetcore/6.0/blazor/components/class-libraries.md
+++ b/aspnetcore/6.0/blazor/components/class-libraries.md
@@ -239,7 +239,7 @@ When the `Link` component is used in a child component, the linked asset is also
An alternative to using the `Link` component is to link to the library's stylesheet in the app's `` markup.
-`wwwroot/index.html` file (Blazor WebAssembly) or `Pages/_Host.cshtml` file (Blazor Server):
+`wwwroot/index.html` file (Blazor WebAssembly) or `Pages/_Layout.cshtml` file (Blazor Server):
```diff
+
diff --git a/aspnetcore/6.0/blazor/components/css-isolation.md b/aspnetcore/6.0/blazor/components/css-isolation.md
index 3249d7ec82f7..02f9b199e780 100644
--- a/aspnetcore/6.0/blazor/components/css-isolation.md
+++ b/aspnetcore/6.0/blazor/components/css-isolation.md
@@ -45,7 +45,7 @@ h1 {
## CSS isolation bundling
-CSS isolation occurs at build time. Blazor rewrites CSS selectors to match markup rendered by the component. The rewritten CSS styles are bundled and produced as a static asset. The stylesheet is referenced inside the `` tag of `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Host.cshtml` (Blazor Server). The following `` element is added by default to an app created from the Blazor project templates, where the placeholder `{ASSEMBLY NAME}` is the project's assembly name:
+CSS isolation occurs at build time. Blazor rewrites CSS selectors to match markup rendered by the component. The rewritten CSS styles are bundled and produced as a static asset. The stylesheet is referenced inside the `` tag of `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Layout.cshtml` (Blazor Server). The following `` element is added by default to an app created from the Blazor project templates, where the placeholder `{ASSEMBLY NAME}` is the project's assembly name:
```html
@@ -208,7 +208,7 @@ In the following example:
* The static web asset base path is `_content/ClassLib`.
* The class library's assembly name is `ClassLib`.
-`wwwroot/index.html` (Blazor WebAssembly) or `Pages_Host.cshtml` (Blazor Server):
+`wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Layout.cshtml` (Blazor Server):
```html
diff --git a/aspnetcore/6.0/blazor/components/event-handling.md b/aspnetcore/6.0/blazor/components/event-handling.md
index ed70327c4831..72b5cc7f454d 100644
--- a/aspnetcore/6.0/blazor/components/event-handling.md
+++ b/aspnetcore/6.0/blazor/components/event-handling.md
@@ -94,7 +94,7 @@ Custom events with custom event arguments are generally enabled with the followi
}
```
-1. Register the custom event with the preceding handler in `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Host.cshtml` (Blazor Server) immediately after the Blazor ``, where the `{SCRIPT PATH AND FILE NAME (.js)}` placeholder is the path and file name of the script.
+Place the following ``, where the `{SCRIPT PATH AND FILE NAME (.js)}` placeholder is the path and file name of the script.
```javascript
`) in the `` element markup of `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Host.cshtml` (Blazor Server):
+Place the script (``) in the `` element markup of `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Layout.cshtml` (Blazor Server):
```html
@@ -68,7 +68,7 @@ Loading JS from the `` isn't the best approach for the following reasons:
### Load a script in `` markup
-Place the script (``) inside the closing `` element markup of `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Host.cshtml` (Blazor Server):
+Place the script (``) inside the closing `` element markup of `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Layout.cshtml` (Blazor Server):
```html
@@ -89,7 +89,7 @@ The `{webassembly|server}` placeholder in the preceding markup is either `webass
Place the script (``) with a script `src` path inside the closing `` tag after the Blazor script reference.
-In `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Host.cshtml` (Blazor Server):
+In `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Layout.cshtml` (Blazor Server):
```html
@@ -136,7 +136,7 @@ For more information, see .
### Inject a script after Blazor starts
-Load JS from an injected script in `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Host.cshtml` (Blazor Server) when the app is initialized:
+Load JS from an injected script in `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Layout.cshtml` (Blazor Server) when the app is initialized:
* Add `autostart="false"` to the ``) inside the closing `` tag after the Blazor script is loaded.
diff --git a/aspnetcore/6.0/blazor/project-structure.md b/aspnetcore/6.0/blazor/project-structure.md
index 52852d6f5e27..ed242290c66d 100644
--- a/aspnetcore/6.0/blazor/project-structure.md
+++ b/aspnetcore/6.0/blazor/project-structure.md
@@ -61,13 +61,14 @@ The Blazor Server template creates the initial files and directory structure for
* `_Host.cshtml`: The root page of the app implemented as a Razor Page:
* When any page of the app is initially requested, this page is rendered and returned in the response.
* The Host page specifies where the root `App` component (`App.razor`) is rendered.
+ * `_Layout.cshtml`: The layout page for the `_Host.cshtml` root page of the app.
* `Counter` component (`Counter.razor`): Implements the Counter page.
* `Error` component (`Error.razor`): Rendered when an unhandled exception occurs in the app.
* `FetchData` component (`FetchData.razor`): Implements the Fetch data page.
* `Index` component (`Index.razor`): Implements the Home page.
> [!NOTE]
-> JavaScript (JS) files added to the `Pages/_Host.cshtml` file should appear before the closing `` tag. The order that custom JS code is loaded from JS files is important in some scenarios. For example, ensure that JS files with interop methods are included before Blazor framework JS files.
+> JavaScript (JS) files added to the `Pages/_Layout.cshtml` file should appear before the closing `` tag. The order that custom JS code is loaded from JS files is important in some scenarios. For example, ensure that JS files with interop methods are included before Blazor framework JS files.
* `Properties/launchSettings.json`: Holds [development environment configuration](xref:fundamentals/environments#development-and-launchsettingsjson).
diff --git a/aspnetcore/6.0/blazor/security/content-security-policy.md b/aspnetcore/6.0/blazor/security/content-security-policy.md
index ccd89fcb2571..ae4250ec7c8d 100644
--- a/aspnetcore/6.0/blazor/security/content-security-policy.md
+++ b/aspnetcore/6.0/blazor/security/content-security-policy.md
@@ -96,7 +96,7 @@ The particular script associated with the error is displayed in the console next
### Blazor Server
-In the `` content of the `Pages/_Host.cshtml` host page, apply the directives described in the [Policy directives](#policy-directives) section:
+In the `` content of the `Pages/_Layout.cshtml` host page, apply the directives described in the [Policy directives](#policy-directives) section:
```cshtml
```
+Prerendering of `` content is disabled in `Pages/_Layout.cshtml`:
+
+```cshtml
+
+```
+
Prerendering might be useful for other pages that don't use `localStorage` or `sessionStorage`. To retain prerendering, defer the loading operation until the browser is connected to the circuit. The following is an example for storing a counter value:
```razor
From ca94538f8c32975228e8a0ee75c1997b089f60d6 Mon Sep 17 00:00:00 2001
From: guardrex <1622880+guardrex@users.noreply.github.com>
Date: Mon, 2 Aug 2021 13:50:40 -0500
Subject: [PATCH 2/3] Updates
---
.../6.0/blazor/components/prerendering-and-integration.md | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/aspnetcore/6.0/blazor/components/prerendering-and-integration.md b/aspnetcore/6.0/blazor/components/prerendering-and-integration.md
index 322a4cd609eb..c69cebce4a27 100644
--- a/aspnetcore/6.0/blazor/components/prerendering-and-integration.md
+++ b/aspnetcore/6.0/blazor/components/prerendering-and-integration.md
@@ -37,7 +37,7 @@ To set up prerendering for a hosted Blazor WebAssembly app:
- builder.RootComponents.Add("#app");
```
-1. Add `Pages/_Host.cshtml` and `Pages/_Layout.cshtml` files to the **`Server`** project's `Pages` folder. You can obtain a `_Host.cshtml` and `_Layout.cshtml` files from a project created from the Blazor Server template with the `dotnet new blazorserver -o BlazorServer` command in a command shell (the `-o BlazorServer` option creates a folder for the project). After placing the `Pages/_Host.cshtml` and `Pages/_Layout.cshtml` files into the **`Server`** project of the hosted Blazor WebAssembly solution, make the following changes to the `_Layout.cshtml` file:
+1. Add `_Host.cshtml` and `_Layout.cshtml` files to the **`Server`** project's `Pages` folder. You can obtain `_Host.cshtml` and `_Layout.cshtml` files from a project created from the Blazor Server template with the `dotnet new blazorserver -o BlazorServer` command in a command shell (the `-o BlazorServer` option creates a folder for the project). After placing the files into the **`Server`** project's `Pages` folder, make the following changes to the `_Layout.cshtml` file:
* Provide an [`@using`](xref:mvc/views/razor#using) directive for the **`Client`** project (for example, `@using BlazorHosted.Client`).
* Update the stylesheet links to point to the WebAssembly project's stylesheets. In the following example, the client project's namespace is `BlazorHosted.Client`:
From 51af819cb8dce53f3813f5f509865441b98ac644 Mon Sep 17 00:00:00 2001
From: guardrex <1622880+guardrex@users.noreply.github.com>
Date: Mon, 2 Aug 2021 13:59:22 -0500
Subject: [PATCH 3/3] Updates
---
.../components/prerendering-and-integration.md | 12 ++++++------
1 file changed, 6 insertions(+), 6 deletions(-)
diff --git a/aspnetcore/6.0/blazor/components/prerendering-and-integration.md b/aspnetcore/6.0/blazor/components/prerendering-and-integration.md
index c69cebce4a27..10d9aecacb43 100644
--- a/aspnetcore/6.0/blazor/components/prerendering-and-integration.md
+++ b/aspnetcore/6.0/blazor/components/prerendering-and-integration.md
@@ -52,18 +52,18 @@ To set up prerendering for a hosted Blazor WebAssembly app:
> [!NOTE]
> Leave the `` element that requests the Bootstrap stylesheet (`css/bootstrap/bootstrap.min.css`) in place.
- * Update the `render-mode` of the [Component Tag Helper](xref:mvc/views/tag-helpers/builtin-th/component-tag-helper) to prerender the root `App` component with :
+ * In the `_Layout.cshtml` file, update the Blazor script source to use the client-side Blazor WebAssembly script:
```diff
- -
- +
+ -
+ +
```
- * Update the Blazor script source to use the client-side Blazor WebAssembly script:
+ * In the `_Host.cshtml` file, update the `render-mode` of the [Component Tag Helper](xref:mvc/views/tag-helpers/builtin-th/component-tag-helper) to prerender the root `App` component with :
```diff
- -
- +
+ -
+ +
```
1. In `Startup.Configure` of the **`Server`** project, change the fallback from the `index.html` file to the `_Host.cshtml` page.