Can't load a local html file into a .NET MAUI WebView-CodePudding

I have a basic webpage that I am attempting to load into a WebView on a XAML page. The relevant code is such:

<WebView x:Name="WebViewQuestionText" Source="editor.html" HeightRequest="500" WidthRequest="500" />

As per the official Microsoft .NET MAUI documentation, I have editor.html located in /Resources/Raw/editor.html and set to a Build Action of MauiAsset. During runtime I don't generate any errors but the WebView is blank. An inspection of the WebView reveals a webpage that is barebones with nothing in it, I assume is the default for a WebView control. If I throw an actual URL in, the page loads up and works as expected, displaying the contents of the given website.

I believe it's simply not finding my page to display it. I'm building for Windows currently but this application will be eventually deployed to both Windows and Mac. How can I ensure it finds it correctly?

As pointed out below - I have also tried it this way, with the same result - when I click the link, I get a blank page.

                            <WebView x:Name="WebViewQuestionText" HeightRequest="500" WidthRequest="500">
                            <WebView.Source>
                                <HtmlWebViewSource>
                                    <HtmlWebViewSource.Html>
                                        <![CDATA[
            <html>
            <head>
            </head>
            <body>
            <h1>.NET MAUI</h1>
            <p>The CSS and image are loaded from local files!</p>
            <p><a href="editor.html">next page</a></p>
            </body>
            </html>                    
            ]]>
                                    </HtmlWebViewSource.Html>
                                </HtmlWebViewSource>
                            </WebView.Source>
                        </WebView>

My editor.html page is as follows:

<!DOCTYPE html>
<HTML>
    <BODY>
        <H1>This is a test</H1>
        <P>This is only a test</P>
    </BODY>
</HTML>

CodePudding user response：

This ends up being a currently open bug against .NET MAUI on the Windows platform.

https://github.com/dotnet/maui/issues/5523

There appears to be a workaround here but it is not ideal. The issue appears to be one of resolving the correct path on Windows for the local file, so the workaround solution is to load the file directly via StreamReader

CodePudding user response：

As mentioned before it is an open bug at the moment. However there is a workaround besides using a StreamReader.

#if WINDOWS
    private static readonly System.Lazy<bool> _isPackagedAppLazy = new System.Lazy<bool>(() =>
    {
        try
        {
            if (Windows.ApplicationModel.Package.Current != null)
                return true;
        }
        catch
        {
            // no-op
        }

        return false;
    });

    private static bool IsPackagedApp => _isPackagedAppLazy.Value;

    // Allow for packaged/unpackaged app support
    string ApplicationPath => IsPackagedApp
        ? Windows.ApplicationModel.Package.Current.InstalledLocation.Path
        : System.AppContext.BaseDirectory;
#endif

    private async void WebView_HandlerChanged(object sender, EventArgs e)
    {
#if WINDOWS            
        await ((sender as WebView).Handler.PlatformView as Microsoft.Maui.Platform.MauiWebView).EnsureCoreWebView2Async();
        ((sender as WebView).Handler.PlatformView as Microsoft.Maui.Platform.MauiWebView).CoreWebView2.SetVirtualHostNameToFolderMapping(
                "localhost",
                ApplicationPath,
                Microsoft.Web.WebView2.Core.CoreWebView2HostResourceAccessKind.Allow);
        var wv = (sender as WebView).Handler.PlatformView as Microsoft.Maui.Platform.MauiWebView;
        wv.LoadUrl($"https://localhost/{wv.Source.AbsolutePath}");

#endif
     }

The WebView would look something like this:

<WebView x:Name="dashBoardWebView" BackgroundColor="Transparent"  
                HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand"
                IsVisible="True"
             HandlerChanged="WebView_HandlerChanged"
             Source="test.html"></WebView>

Hope it helps.

Note: Taken from https://github.com/dotnet/maui/pull/7672