无法将本地 html 文件加载到 .NET MAUI WebView

Question

I have a basic webpage that I am attempting to load into a WebView on a XAML page.我有一个基本网页，我试图将其加载到 XAML 页面上的 WebView 中。 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.根据官方Microsoft .NET MAUI 文档，我的 editor.html 位于 /Resources/Raw/editor.html 并设置为 MauiAsset 的构建操作。 During runtime I don't generate any errors but the WebView is blank.在运行时我不会产生任何错误，但 WebView 是空白的。 An inspection of the WebView reveals a webpage that is barebones with nothing in it, I assume is the default for a WebView control.对 WebView 的检查显示一个网页是准系统的，其中没有任何内容，我认为这是 WebView 控件的默认设置。 If I throw an actual URL in, the page loads up and works as expected, displaying the contents of the given website.如果我输入一个实际的 URL，页面会加载并按预期工作，显示给定网站的内容。

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.我目前正在为 Windows 构建，但这个应用程序最终将部署到 Windows 和 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:我的 editor.html 页面如下：

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

Answer 1

I've fixed this with this PR into .Net Maui.我已将此 PR修复到 .Net Maui 中。 Will be in the SR2 release due in the next few weeks.将在未来几周内发布 SR2。

The docs suggested it worked consistently on all platforms, but it simply had never been implemented on Windows... slightly concerning.文档建议它在所有平台上都可以始终如一地工作，但它根本就没有在 Windows 上实现过……有点担心。

The workaround I've posted on the PR (mentioned also by Reinaldo below) will get around this for the mean time, however you should probably remove it once SR2 is released and you update to it.我在 PR 上发布的解决方法（下面 Reinaldo 也提到过）将暂时解决这个问题，但是一旦 SR2 发布并更新到它，您可能应该将其删除。

Answer 2

This ends up being a currently open bug against .NET MAUI on the Windows platform.这最终成为 Windows 平台上针对 .NET MAUI 的当前开放错误。

https://github.com/dotnet/maui/issues/5523 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该问题似乎是在 Windows 上为本地文件解析正确路径之一，因此解决方法是直接通过 StreamReader 加载文件

Answer 3

As mentioned before it is an open bug at the moment.如前所述，它目前是一个开放的错误。 However there is a workaround besides using a StreamReader.但是，除了使用 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 看起来像这样：

<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注意：取自https://github.com/dotnet/maui/pull/7672

无法将本地 html 文件加载到 .NET MAUI WebView

问题描述

3 个解决方案

解决方案1
1 已采纳 2022-07-08 16:31:35

解决方案2
0 2022-06-14 13:45:38

解决方案3
0 2022-06-27 15:45:27

无法将本地 html 文件加载到 .NET MAUI WebView

问题描述

3 个解决方案

解决方案1 1 已采纳 2022-07-08 16:31:35

解决方案2 0 2022-06-14 13:45:38

解决方案3 0 2022-06-27 15:45:27

解决方案1
1 已采纳 2022-07-08 16:31:35

解决方案2
0 2022-06-14 13:45:38

解决方案3
0 2022-06-27 15:45:27