Skip to content

Commit 3a69ac9

Browse files
authored
Merge pull request #35224 from dotnet/main
2 parents 9629ac9 + 937742b commit 3a69ac9

File tree

10 files changed

+233
-19
lines changed

10 files changed

+233
-19
lines changed

aspnetcore/blazor/fundamentals/static-files.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,7 @@ Assets are delivered via the <xref:Microsoft.AspNetCore.Components.ComponentBase
6666

6767
## `ImportMap` component
6868

69-
*This section applies to server-side Blazor apps.*
69+
*This section applies to Blazor Web Apps that call <xref:Microsoft.AspNetCore.Builder.RazorComponentsEndpointRouteBuilderExtensions.MapRazorComponents%2A>.*
7070

7171
The `ImportMap` component (<xref:Microsoft.AspNetCore.Components.ImportMap>) represents an import map element (`<script type="importmap"></script>`) that defines the import map for module scripts. The Import Map component is placed in `<head>` content of the root component, typically the `App` component (`Components/App.razor`).
7272

@@ -190,6 +190,8 @@ The preceding code results in the following import map:
190190

191191
## Import map Content Security Policy (CSP) violations
192192

193+
*This section applies to Blazor Web Apps that call <xref:Microsoft.AspNetCore.Builder.RazorComponentsEndpointRouteBuilderExtensions.MapRazorComponents%2A>.*
194+
193195
The `ImportMap` component is rendered as an inline `<script>` tag, which violates a strict [Content Security Policy (CSP)](https://developer.mozilla.org/docs/Web/HTTP/Guides/CSP) that sets the `default-src` or `script-src` directive.
194196

195197
For examples of how to address the policy violation with Subresource Integrity (SRI) or a cryptographic nonce, see [Resolving CSP violations with Subresource Integrity (SRI) or a nonce](xref:blazor/security/content-security-policy#resolving-csp-violations-with-subresource-integrity-sri-or-a-cryptographic-nonce).

aspnetcore/blazor/hosting-models.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -87,18 +87,18 @@ The Blazor WebAssembly hosting model runs components client-side in the browser
8787

8888
:::moniker range=">= aspnetcore-8.0"
8989

90-
Blazor web apps can use the Blazor WebAssembly hosting model to enable client-side interactivity. When an app is created that exclusively runs on the Blazor WebAssembly hosting model without server-side rendering and interactivity, the app is called a *standalone* Blazor WebAssembly app.
90+
Blazor Web Apps can use the Blazor WebAssembly hosting model to enable client-side interactivity. When an app is created that exclusively runs on the Blazor WebAssembly hosting model without server-side rendering and interactivity, the app is called a *standalone* Blazor WebAssembly app.
9191

9292
:::moniker-end
9393

9494
:::moniker range="< aspnetcore-8.0"
9595

9696
When the Blazor WebAssembly app is created for deployment without a backend ASP.NET Core app to serve its files, the app is called a *standalone* Blazor WebAssembly app.
9797

98-
:::moniker-end
99-
10098
When a standalone Blazor WebAssembly app uses a backend ASP.NET Core app to serve its files, the app is called a *hosted* Blazor WebAssembly app. Using hosted Blazor WebAssembly, you get a full-stack web development experience with .NET, including the ability to share code between the client and server apps, support for prerendering, and integration with MVC and Razor Pages. A hosted client app can interact with its backend server app over the network using a variety of messaging frameworks and protocols, such as [web API](xref:web-api/index), [gRPC-web](xref:grpc/index), and [SignalR](xref:signalr/introduction) (<xref:blazor/tutorials/signalr-blazor>).
10199

100+
:::moniker-end
101+
102102
:::moniker range=">= aspnetcore-6.0"
103103

104104
A Blazor WebAssembly app built as a [Progressive Web App (PWA)](xref:blazor/progressive-web-app) uses modern browser APIs to enable many of the capabilities of a native client app, such as working offline, running in its own app window, launching from the host's operating system, receiving push notifications, and automatically updating in the background.
@@ -420,7 +420,7 @@ Blazor Hybrid apps have full access to native client API capabilities via .NET n
420420

421421
### Web-based deployment
422422

423-
Blazor web apps are updated on the next app refresh from the browser.
423+
Blazor Web Apps are updated on the next app refresh from the browser.
424424

425425
:::moniker range=">= aspnetcore-6.0"
426426

aspnetcore/blazor/hybrid/security/security-considerations.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -88,7 +88,7 @@ iOS and :::no-loc text="Mac Catalyst"::: both use [`WKWebView`](https://develope
8888

8989
### Windows (.NET MAUI, WPF, Windows Forms)
9090

91-
On Windows, the Chromium-based [Microsoft Edge `WebView2`](/microsoft-edge/webview2/) is required to run Blazor web apps.
91+
On Windows, the Chromium-based [Microsoft Edge `WebView2`](/microsoft-edge/webview2/) is required to run Blazor Web Apps.
9292

9393
The newest installed version of `WebView2`, known as the *:::no-loc text="Evergreen distribution":::*, is used. If you wish to ship a specific version of `WebView2` with the app, use the *:::no-loc text="Fixed Version distribution":::*.
9494

aspnetcore/blazor/javascript-interoperability/call-javascript-from-dotnet.md

Lines changed: 126 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -453,6 +453,107 @@ IJSRuntime JS { get; set; }
453453

454454
[!INCLUDE[](~/blazor/includes/js-interop/synchronous-js-interop-call-js.md)]
455455

456+
:::moniker range=">= aspnetcore-10.0"
457+
458+
<!-- UPDATE 10.0 - API Browser cross-links in the next
459+
two H2 sections. -->
460+
461+
## Create an instance of a JS object using a constructor function
462+
463+
Create an instance of a JS object using a constructor function and get the <xref:Microsoft.JSInterop.IJSObjectReference>/<xref:Microsoft.JSInterop.IJSInProcessObjectReference> .NET handle for referencing the instance with the following API:
464+
465+
* `InvokeNewAsync` (asynchronous)
466+
* `InvokeNew` (synchronous)
467+
468+
Examples in this section demonstrate the API calls with the following `TestClass` with a constructor function (`constructor(text)`):
469+
470+
```javascript
471+
window.TestClass = class {
472+
constructor(text) {
473+
this.text = text;
474+
}
475+
476+
getTextLength() {
477+
return this.text.length;
478+
}
479+
}
480+
```
481+
482+
### Asynchronous `InvokeNewAsync`
483+
484+
Use `InvokeNewAsync(string identifier, object?[]? args)` on <xref:Microsoft.JSInterop.IJSRuntime> and <xref:Microsoft.JSInterop.IJSObjectReference> to invoke the specified JS constructor function asynchronously. The function is invoked with the `new` operator. In the following example, `TestClass` contains a constructor function, and `classRef` is an <xref:Microsoft.JSInterop.IJSObjectReference>.
485+
486+
```csharp
487+
var classRef = await JSRuntime.InvokeNewAsync("TestClass", "Blazor!");
488+
var text = await classRef.GetValueAsync<string>("text");
489+
var textLength = await classRef.InvokeAsync<int>("getTextLength");
490+
```
491+
492+
An overload is available that takes a <xref:System.Threading.CancellationToken> argument or <xref:System.TimeSpan> timeout argument.
493+
494+
### Synchronous `InvokeNew`
495+
496+
Use `InvokeNew(string identifier, object?[]? args)` on <xref:Microsoft.JSInterop.IJSInProcessRuntime> and <xref:Microsoft.JSInterop.IJSInProcessObjectReference> to invoke the specified JS constructor function synchronously. The function is invoked with the `new` operator. In the following example, `TestClass` contains a constructor function, and `classRef` is an <xref:Microsoft.JSInterop.IJSInProcessObjectReference>:
497+
498+
```csharp
499+
var inProcRuntime = ((IJSInProcessRuntime)JSRuntime);
500+
var classRef = inProcRuntime.InvokeNew("TestClass", "Blazor!");
501+
var text = await classRef.GetValueAsync<string>("text");
502+
var textLength = await classRef.InvokeAsync<int>("getTextLength");
503+
```
504+
505+
An overload is available that takes a <xref:System.Threading.CancellationToken> argument or <xref:System.TimeSpan> timeout argument.
506+
507+
## Read or modify the value of a JS object property
508+
509+
Read or modify the value of a JS object property, both data and accessor properties, with the following API:
510+
511+
* `GetValueAsync`/`SetValueAsync` (asynchronous)
512+
* `GetValue`/`SetValue` (synchronous)
513+
514+
Examples in this section demonstrate the API calls with the following JS object (`testObject`):
515+
516+
```javascript
517+
window.testObject = {
518+
num: 10
519+
}
520+
```
521+
522+
### Asynchronous `GetValueAsync` and `SetValueAsync`
523+
524+
Use `GetValueAsync<TValue>(string identifier)` to read the value of the specified JS property asynchronously. A <xref:Microsoft.JSInterop.JSException> is thrown if the property doesn't exist or is a `set`-only property. In the following example, the value of `testObject.num` (10) is stored in `valueFromDataPropertyAsync`:
525+
526+
```csharp
527+
var valueFromDataPropertyAsync =
528+
await JSRuntime.GetValueAsync<int>("testObject.num");
529+
```
530+
531+
Use `SetValueAsync<TValue>(string identifier, TValue value)` to update the value of the specified JS property asynchronously. If the property isn't defined on the target object, the property is created. A <xref:Microsoft.JSInterop.JSException> is thrown if the property exists but isn't writable or when a new property can't be added to the object. In the following example, `testObject.num` is set to 20, and `num2` is created with a value of 30 on `testObject`:
532+
533+
```csharp
534+
await JSRuntime.SetValueAsync("testObject.num", 20);
535+
await JSRuntime.SetValueAsync("testObject.num2", 30);
536+
```
537+
538+
### Synchronous `GetValue` and `SetValue`
539+
540+
Use `GetValue<TValue>(string identifier)` to read the value of the specified JS property synchronously. A <xref:Microsoft.JSInterop.JSException> is thrown if the property doesn't exist or is a `set`-only property. In the following example, the value of `testObject.num` (10) is stored in `valueFromDataProperty`:
541+
542+
```csharp
543+
var inProcRuntime = ((IJSInProcessRuntime)JSRuntime);
544+
var valueFromDataProperty = inProcRuntime.GetValue<int>("testObject.num");
545+
```
546+
547+
Use `SetValue<TValue>(string identifier, TValue value)` to update the value of the specified JS property synchronously. The property can't be a `get`-only property. If the property isn't defined on the target object, the property is created. A <xref:Microsoft.JSInterop.JSException> is thrown if the property exists but isn't writable or when a new property can't be added to the object. In the following example, `testObject.num` is set to 20, and `num2` is created with a value of 30 on `testObject`:
548+
549+
```csharp
550+
var inProcRuntime = ((IJSInProcessRuntime)JSRuntime);
551+
inProcRuntime.SetValue("testObject.num", 20);
552+
inProcRuntime.SetValue("testObject.num2", 30);
553+
```
554+
555+
:::moniker-end
556+
456557
## JavaScript location
457558

458559
Load JavaScript (JS) code using any of approaches described by the [article on JavaScript location](xref:blazor/js-interop/javascript-location):
@@ -519,12 +620,35 @@ For browser compatibility, see [Can I use: JavaScript modules: dynamic import](h
519620

520621
In server-side scenarios, JS interop calls can't be issued after Blazor's SignalR circuit is disconnected. Without a circuit during component disposal or at any other time that a circuit doesn't exist, the following method calls fail and log a message that the circuit is disconnected as a <xref:Microsoft.JSInterop.JSDisconnectedException>:
521622

623+
:::moniker-end
624+
625+
:::moniker range=">= aspnetcore-10.0"
626+
627+
<!-- UPDATE 10.0 - API Browser cross-links -->
628+
522629
* JS interop method calls
523630
* <xref:Microsoft.JSInterop.IJSRuntime.InvokeAsync%2A?displayProperty=nameWithType>
524631
* <xref:Microsoft.JSInterop.JSRuntimeExtensions.InvokeAsync%2A?displayProperty=nameWithType>
525-
* <xref:Microsoft.JSInterop.JSRuntimeExtensions.InvokeVoidAsync%2A?displayProperty=nameWithType>)
632+
* <xref:Microsoft.JSInterop.JSRuntimeExtensions.InvokeVoidAsync%2A?displayProperty=nameWithType>
633+
* `InvokeNewAsync`
634+
* `GetValueAsync`
635+
* `SetValueAsync`
526636
* `Dispose`/`DisposeAsync` calls on any <xref:Microsoft.JSInterop.IJSObjectReference>.
527637

638+
:::moniker-end
639+
640+
:::moniker range=">= aspnetcore-5.0 < aspnetcore-10.0"
641+
642+
* JS interop method calls
643+
* <xref:Microsoft.JSInterop.IJSRuntime.InvokeAsync%2A?displayProperty=nameWithType>
644+
* <xref:Microsoft.JSInterop.JSRuntimeExtensions.InvokeAsync%2A?displayProperty=nameWithType>
645+
* <xref:Microsoft.JSInterop.JSRuntimeExtensions.InvokeVoidAsync%2A?displayProperty=nameWithType>
646+
* `Dispose`/`DisposeAsync` calls on any <xref:Microsoft.JSInterop.IJSObjectReference>.
647+
648+
:::moniker-end
649+
650+
:::moniker range=">= aspnetcore-5.0"
651+
528652
In order to avoid logging <xref:Microsoft.JSInterop.JSDisconnectedException> or to log custom information in server-side Blazor, catch the exception in a [`try-catch`](/dotnet/csharp/language-reference/keywords/try-catch) statement.
529653

530654
For the following component disposal example:
@@ -627,7 +751,7 @@ In the preceding example:
627751

628752
Dynamically importing a module requires a network request, so it can only be achieved asynchronously by calling <xref:Microsoft.JSInterop.IJSRuntime.InvokeAsync%2A>.
629753

630-
`IJSInProcessObjectReference` represents a reference to a JS object whose functions can be invoked synchronously in client-side components. For more information, see the [Synchronous JS interop in client-side components](#synchronous-js-interop-in-client-side-components) section.
754+
<xref:Microsoft.JSInterop.IJSInProcessObjectReference> represents a reference to a JS object whose functions can be invoked synchronously in client-side components. For more information, see the [Synchronous JS interop in client-side components](#synchronous-js-interop-in-client-side-components) section.
631755

632756
> [!NOTE]
633757
> When the external JS file is supplied by a [Razor class library](xref:blazor/components/class-libraries), specify the module's JS file using its stable static web asset path: `./_content/{PACKAGE ID}/{SCRIPT PATH AND FILE NAME (.js)}`:

aspnetcore/blazor/javascript-interoperability/index.md

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -328,12 +328,31 @@ Don't assume that observing `document.body`, instead of `target.parentNode`, is
328328

329329
JavaScript (JS) interop calls can't be issued after Blazor's SignalR circuit is disconnected. Without a circuit during component disposal or at any other time that a circuit doesn't exist, the following method calls fail and log a message that the circuit is disconnected as a <xref:Microsoft.JSInterop.JSDisconnectedException>:
330330

331+
:::moniker range=">= aspnetcore-10.0"
332+
333+
<!-- UPDATE 10.0 - API Browser cross-links -->
334+
331335
* JS interop method calls
332336
* <xref:Microsoft.JSInterop.IJSRuntime.InvokeAsync%2A?displayProperty=nameWithType>
333337
* <xref:Microsoft.JSInterop.JSRuntimeExtensions.InvokeAsync%2A?displayProperty=nameWithType>
334338
* <xref:Microsoft.JSInterop.JSRuntimeExtensions.InvokeVoidAsync%2A?displayProperty=nameWithType>
339+
* `InvokeNewAsync`
340+
* `GetValueAsync`
341+
* `SetValueAsync`
335342
* `Dispose`/`DisposeAsync` calls on any <xref:Microsoft.JSInterop.IJSObjectReference>.
336343

344+
:::moniker-end
345+
346+
:::moniker range="< aspnetcore-10.0"
347+
348+
* JS interop method calls
349+
* <xref:Microsoft.JSInterop.IJSRuntime.InvokeAsync%2A?displayProperty=nameWithType>
350+
* <xref:Microsoft.JSInterop.JSRuntimeExtensions.InvokeAsync%2A?displayProperty=nameWithType>
351+
* <xref:Microsoft.JSInterop.JSRuntimeExtensions.InvokeVoidAsync%2A?displayProperty=nameWithType>
352+
* `Dispose`/`DisposeAsync` calls on any <xref:Microsoft.JSInterop.IJSObjectReference>.
353+
354+
:::moniker-end
355+
337356
In order to avoid logging <xref:Microsoft.JSInterop.JSDisconnectedException> or to log custom information, catch the exception in a [`try-catch`](/dotnet/csharp/language-reference/keywords/try-catch) statement.
338357

339358
For the following component disposal example:

aspnetcore/blazor/tooling.md

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ To create a Blazor app with Visual Studio, use the following guidance:
3131

3232
* Create a new project using one of the available Blazor templates:
3333

34-
* **Blazor Web App**: Creates a Blazor web app that supports interactive server-side rendering (interactive SSR) and client-side rendering (CSR). The Blazor Web App template is recommended for getting started with Blazor to learn about server-side and client-side Blazor features.
34+
* **Blazor Web App**: Creates an app that supports interactive server-side rendering (interactive SSR) and client-side rendering (CSR). The Blazor Web App template is recommended for getting started with Blazor to learn about server-side and client-side Blazor features.
3535
* **Blazor WebAssembly Standalone App**: Creates a standalone client web app that can be deployed as a static site.
3636

3737
Select **Next**.
@@ -62,13 +62,6 @@ Select **Next**.
6262

6363
* For more information on the options in the **Additional information** dialog, see the [Blazor project templates and template options](#blazor-project-templates-and-template-options) section.
6464

65-
:::moniker range=">= aspnetcore-8.0"
66-
67-
> [!NOTE]
68-
> The Hosted Blazor WebAssembly project template isn't available in ASP.NET Core 8.0 or later. To create a hosted Blazor WebAssembly app, a **Framework** option earlier than .NET 8.0 must be selected with the **ASP.NET Core Hosted** checkbox.
69-
70-
:::moniker-end
71-
7265
:::moniker range="< aspnetcore-8.0"
7366

7467
* For a *hosted* Blazor WebAssembly app, select the **ASP.NET Core Hosted** checkbox in the **Additional information** dialog.
@@ -508,6 +501,14 @@ The Blazor framework provides project templates for creating new apps. The templ
508501
* Blazor Web App project template: `blazor`
509502
* Standalone Blazor WebAssembly app project template: `blazorwasm`
510503

504+
> [!NOTE]
505+
> The "Hosted" Blazor WebAssembly project template option isn't available in ASP.NET Core 8.0 or later. To create a hosted Blazor WebAssembly app, a **Framework** option earlier than .NET 8.0 must be selected with the **ASP.NET Core Hosted** checkbox. However, we recommend a Blazor Web App for all new Blazor development in .NET 8 or later. For more information, see the following resources:
506+
>
507+
> * <xref:blazor/index#build-a-full-stack-web-app-with-blazor>
508+
> * <xref:aspnetcore-8#new-blazor-web-app-template>
509+
> * <xref:blazor/project-structure#blazor-web-app>
510+
> * <xref:migration/70-to-80#convert-a-hosted-blazor-webassembly-app-into-a-blazor-web-app>
511+
511512
:::moniker-end
512513

513514
:::moniker range=">= aspnetcore-7.0 < aspnetcore-8.0"

aspnetcore/fundamentals/openapi/openapi-comments.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ uid: fundamentals/openapi/aspnet-openapi-xml
1313

1414
ASP.NET Core XML documentation processing extracts code comments automatically to populate API documentation, ensuring the code and documentation remain synchronized. Metadata from XML documentation comments is included in the generated OpenAPI document without requiring changes to the app code, as long as the project is configured to generate the XML documentation file. XML documentation comments are automatically detected in the application assembly and referenced assemblies with XML documentation enabled.
1515

16-
ASP.NET Core processes [XML documentation tags](https://learn.microsoft.com/dotnet/csharp/language-reference/xmldoc/recommended-tags) like: `<c>`, `<code>`, `<list>`, `<para>`, `<paramref>`, `<typeparamref>`, `<see>`, and `<seealso>`. For XML documentation tags that use references to other elements, like `<see cref="SomeOtherType">`, the implementation strips out the XML tag and maps the reference to plain text for inclusion in the OpenAPI document.
16+
ASP.NET Core processes [XML documentation tags](/dotnet/csharp/language-reference/xmldoc/recommended-tags) like: `<c>`, `<code>`, `<list>`, `<para>`, `<paramref>`, `<typeparamref>`, `<see>`, and `<seealso>`. For XML documentation tags that use references to other elements, like `<see cref="SomeOtherType">`, the implementation strips out the XML tag and maps the reference to plain text for inclusion in the OpenAPI document.
1717

1818
ASP.NET Core XML documentation processing doesn't affect runtime performance. The source generator processes XML documentation at compile time and caches the results, with minimal runtime overhead when rendering the OpenAPI documentation. Furthermore, the OpenAPI document can be cached at runtime using [output-caching](/aspnet/core/performance/caching/overview#output-caching) to further optimize performance.
1919

aspnetcore/fundamentals/openapi/using-openapi-documents.md

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,10 +20,11 @@ The `Swashbuckle.AspNetCore.SwaggerUi` package provides a bundle of Swagger UI's
2020

2121
* Install the `Swashbuckle.AspNetCore.SwaggerUi` package.
2222
* Enable the swagger-ui middleware with a reference to the [OpenAPI route registered earlier](xref:fundamentals/openapi/aspnetcore-openapi#customize-the-openapi-endpoint-route).
23-
* To limit information disclosure and security vulnerability, ***only enable Swagger UI in development environments.***
2423

2524
[!code-csharp[](~/fundamentals/openapi/samples/9.x/WebMinOpenApi/Program.cs?name=snippet_swaggerui)]
2625

26+
As a security best practice on limiting information disclosure, ***OpenAPI user interfaces (Swagger UI, ReDoc, Scalar) should only be enabled in development environments.*** For example, see [Swagger OAuth 2.0 configuration](https://swagger.io/docs/open-source-tools/swagger-ui/usage/oauth2/).
27+
2728
## Use Scalar for interactive API documentation
2829

2930
[Scalar](https://scalar.com/) is an open-source interactive document UI for OpenAPI. Scalar can integrate with the OpenAPI endpoint provided by ASP.NET Core. To configure Scalar, install the `Scalar.AspNetCore` package.

0 commit comments

Comments
 (0)