在 WebView Metro Style 应用程序中加载本地 html 文件答案

【问题标题】：Load local html file in WebView Metro Style app在 WebView Metro Style 应用程序中加载本地 html 文件
【发布时间】：2023-03-10 16:08:01
【问题描述】：

我在 Metro 风格应用程序的 WebView 控件中加载 html 文件时遇到了一些问题。我一直在搜索互联网，发现您无法使用 NavigateTo 方法加载本地 html 文件。我还发现有一种解决方法，您可以在其中使用控件的 NavigateToString 方法。下面是我看到这个的链接： http://social.msdn.microsoft.com/Forums/en-US/winappswithcsharp/thread/9cd8614d-2dc8-48ac-9cd9-57b03a644930

有人在有关该主题的帖子中举例说明了如何做到这一点。他们使用了一个字节数组，将调用 IInputstream.ReadAsync 方法获得的数据放入其中。我遇到的问题是，在我调用该方法后，字节数组中充满了 0，我认为这是不行的。谁能帮我解决这个问题？

【问题讨论】：

标签： c# webview microsoft-metro

【解决方案1】：

您可以使用ms-appx-web:/// 协议而不是ms-appx:/// 来切换上下文，我已经在 HTML/JS Metro 风格应用程序中成功加载了本地 Html 文件和关联的 CSS 和 JavaScript。

我没有在 XAML Metro Style App 中尝试过这个，但相信可以使用ms-appx-web:/// 协议。限制是您的 Html（如果是本地的，即不是 Web 托管的）必须驻留在一个 WinRT 包中内，在您的情况下它似乎是 /Assets。

【讨论】：

我试了一下你的答案，它就像一个魅力：D。感谢您的帮助。
如果 html 文件在 WinRT 包“外部”怎么办？让我们在“Windows.Storage.ApplicationData.Current.LocalFolder”中说
在 Windows 8.1 中，当我尝试将我的 html 文件复制到资产文件夹时，我收到拒绝访问。

【解决方案2】：

我遇到了同样的问题。在我的应用程序中，我有一个名为 Default.html 的文件被读取，其内容显示在 WebView 控件中。

var html = await Windows.Storage.PathIO.ReadTextAsync("ms-appx:///Assets/Default.html");
MyWebView.NavigateToString(html);

请注意，我使用await 和ReadTextAsync，因此代码是异步的（在执行 IO 时应该这样做），您放置它的函数必须定义为异步，例如：

private async void LoadWebView( file ) { ... }

【讨论】：

感谢您的回复。确实你的建议有效，但我在徘徊，有没有办法加载在html页面标题中调用的js和css文件？
本地？否 :/ 不幸的是，此时 WebView 控件不了解执行此操作所需的 ms-appx 协议。 MSDN 上有一个关于这个的话题。我遇到了同样的问题，只好将所有 css 和 JavaScript 包含到 HTML 文件中，这并不理想。希望这将很快得到解决！

【解决方案3】：

这是一个快速示例，如果对您有帮助，请告诉我：

我的资产文件夹中有一个名为 MyHTMLPage 的 Html 文件，它有一个内容类型的构建操作和一个复制到输出以始终复制。我的 HTML 文件：

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
<div style="background-color: chartreuse">HELLO WORLD, from a webview</div>  
</body>
</html>

在我的主页.xaml 上：

 <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <WebView x:Name="MyWebView"  Width="200" Height="300"></WebView>
    </Grid>

在我的主页.cs 上：

 public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
            Loaded += MainPage_Loaded;
        }

        private void MainPage_Loaded(object sender, RoutedEventArgs e)
        {
            string src = "ms-appx-web:///Assets/MyHTMLPage.html";
            this.MyWebView.Navigate(new Uri(src));
        }
    }

瞧，这应该可以工作。

【讨论】：