Skip to content

Commit

Permalink
HybridWebView/BlazorWebView updates (#2581)
Browse files Browse the repository at this point in the history
* Default address changed.

* InvokeJavaScriptAsync changes return type.
  • Loading branch information
davidbritch authored Oct 28, 2024
1 parent c7bb118 commit c05bbb3
Show file tree
Hide file tree
Showing 3 changed files with 11 additions and 11 deletions.
6 changes: 3 additions & 3 deletions docs/user-interface/controls/blazorwebview.md
Original file line number Diff line number Diff line change
Expand Up @@ -235,12 +235,12 @@ This switch enables <xref:Microsoft.AspNetCore.Components.WebView.Maui.BlazorWeb

## Host content using the legacy behavior on iOS and Mac Catalyst

On iOS and Mac Catalyst 18, the default behavior for hosting content in a <xref:Microsoft.AspNetCore.Components.WebView.Maui.BlazorWebView> has changed to `localhost`. The internal `0.0.0.0` address used to host content no longer works and results in the <xref:Microsoft.AspNetCore.Components.WebView.Maui.BlazorWebView> not loading any content and rendering as an empty rectangle.
On iOS and Mac Catalyst 18, the default behavior for hosting content in a <xref:Microsoft.AspNetCore.Components.WebView.Maui.BlazorWebView> has changed to `localhost`. The internal `0.0.0.1` address used to host content no longer works and results in the <xref:Microsoft.AspNetCore.Components.WebView.Maui.BlazorWebView> not loading any content and rendering as an empty rectangle.

To opt into using the `0.0.0.0` address, add the following code to the `CreateMauiApp` method in *MauiProgram.cs*:
To opt into using the `0.0.0.1` address, add the following code to the `CreateMauiApp` method in *MauiProgram.cs*:

```csharp
// Set this switch to use the LEGACY behavior of always using 0.0.0.0 to host BlazorWebView
// Set this switch to use the LEGACY behavior of always using 0.0.0.1 to host BlazorWebView
AppContext.SetSwitch("BlazorWebView.AppHostAddressAlways0000", true);
```

Expand Down
10 changes: 5 additions & 5 deletions docs/user-interface/controls/hybridwebview.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
title: HybridWebView
description: Learn how to use a HybridWebView to host HTML/JS/CSS content in a WebView, and communicate between that content and .NET.
ms.topic: concept-article
ms.date: 09/20/2024
ms.date: 10/28/2024
monikerRange: ">=net-maui-9.0"

#customer intent: As a developer, I want to host HTML/JS/CSS content in a web view so that I can publish the web app as a mobile app.
Expand Down Expand Up @@ -196,7 +196,7 @@ To create a .NET MAUI app with a <xref:Microsoft.Maui.Controls.HybridWebView>:
Your app's C# code can synchronously and asynchronously invoke JavaScript methods within the <xref:Microsoft.Maui.Controls.HybridWebView>, with optional parameters and an optional return value. This can be achieved with the `InvokeJavaScriptAsync` and `EvaluateJavaScriptAsync` methods:

- The `EvaluateJavaScriptAsync` method runs the JavaScript code provided via a parameter and returns the result as a string.
- The `InvokeJavaScriptAsync` method invokes a specified JavaScript method, optionally passing in parameter values, and returns a string containing the return value of the JavaScript method. Internally, parameters and return values are JSON encoded.
- The `InvokeJavaScriptAsync` method invokes a specified JavaScript method, optionally passing in parameter values, and specifies a generic argument that indicates the type of the return value. It returns an object of the generic argument type that contains the return value of the called JavaScript method. Internally, parameters and return values are JSON encoded.

### Invoke synchronous JavaScript

Expand All @@ -214,7 +214,7 @@ The `AddNumbers` JavaScript method can be invoked from C# with the `InvokeJavaSc
double x = 123d;
double y = 321d;

var result = await hybridWebView.InvokeJavaScriptAsync<double>(
double result = await hybridWebView.InvokeJavaScriptAsync<double>(
"AddNumbers", // JavaScript method name
HybridSampleJSContext.Default.Double, // JSON serialization info for return type
[x, y], // Parameter values
Expand Down Expand Up @@ -256,14 +256,14 @@ async function EvaluateMeWithParamsAndAsyncReturn(s1, s2) {
The `EvaluateMeWithParamsAndAsyncReturn` JavaScript method can be invoked from C# with the `InvokeJavaScriptAsync` method:

```csharp
var asyncResult = await hybridWebView.InvokeJavaScriptAsync<Dictionary<string, string>>(
Dictionary<string, string> asyncResult = await hybridWebView.InvokeJavaScriptAsync<Dictionary<string, string>>(
"EvaluateMeWithParamsAndAsyncReturn", // JavaScript method name
HybridSampleJSContext.Default.DictionaryStringString, // JSON serialization info for return type
["new_key", "new_value"], // Parameter values
[HybridSampleJSContext.Default.String, HybridSampleJSContext.Default.String]); // JSON serialization info for each parameter
```

In this example, `asyncResult` is a `Dictionary<string, string>` containing the JSON data from the web request.
In this example, `asyncResult` is a `Dictionary<string, string>` that contains the JSON data from the web request.

The method invocation requires specifying `JsonTypeInfo` objects that include serialization information for the types used in the operation. These objects are automatically created by including the following `partial` class in your project:

Expand Down
6 changes: 3 additions & 3 deletions docs/whats-new/dotnet-9.md
Original file line number Diff line number Diff line change
Expand Up @@ -144,12 +144,12 @@ The binding mode for `IsVisible` and `IsEnabled` on a <xref:Microsoft.Maui.Contr

### BlazorWebView

On iOS and Mac Catalyst 18, .NET MAUI 9 changes the default behavior for hosting content in a <xref:Microsoft.AspNetCore.Components.WebView.Maui.BlazorWebView> to `localhost`. The internal `0.0.0.0` address used to host content no longer works and results in the <xref:Microsoft.AspNetCore.Components.WebView.Maui.BlazorWebView> not loading any content and rendering as an empty rectangle.
On iOS and Mac Catalyst 18, .NET MAUI 9 changes the default behavior for hosting content in a <xref:Microsoft.AspNetCore.Components.WebView.Maui.BlazorWebView> to `localhost`. The internal `0.0.0.1` address used to host content no longer works and results in the <xref:Microsoft.AspNetCore.Components.WebView.Maui.BlazorWebView> not loading any content and rendering as an empty rectangle.

To opt into using the `0.0.0.0` address, add the following code to the `CreateMauiApp` method in *MauiProgram.cs*:
To opt into using the `0.0.0.1` address, add the following code to the `CreateMauiApp` method in *MauiProgram.cs*:

```csharp
// Set this switch to use the LEGACY behavior of always using 0.0.0.0 to host BlazorWebView
// Set this switch to use the LEGACY behavior of always using 0.0.0.1 to host BlazorWebView
AppContext.SetSwitch("BlazorWebView.AppHostAddressAlways0000", true);
```

Expand Down

0 comments on commit c05bbb3

Please sign in to comment.