在UWP WebView

时间:2017-02-23 14:05:25

标签: c# webview uwp uwp-xaml

我认为这是非常简单的任务,我在网络上看到了很多例子,但由于我遇到了不同的例外情况,但它们中没有一个能为我工作。

HTML:

<html lang="en">
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    <p>
        Help html content.
    </p>
</body>
</html>

XAML:

<Grid>
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition Height="30"/>
        </Grid.RowDefinitions>

        <WebView x:Name="webView" />
        <Button x:Name="buttonRefresh" 
                Grid.Row="1" 
                HorizontalAlignment="Center"
                Click="buttonRefresh_Click">
            Refresh
        </Button>
    </Grid>

要在我的UWP应用程序LocalFolder中显示保存在help.html文件中的静态html,我已经尝试过以下操作:
- 使用导航方法:

private void buttonRefresh_Click(object sender, RoutedEventArgs e)
        {
            var uri = new Uri("ms-appdata:///local/help.html");
            webView.Navigate(uri);
        }

,结果是以下异常:

System.ArgumentException: Value does not fall within the expected range.
   at Windows.UI.Xaml.Controls.WebView.Navigate(Uri source)
   at SimpleUwpApp.Proxy.SimplerPage.buttonRefresh_Click(Object sender, RoutedEventArgs e)


- 尝试在后面的代码中明确设置webView的Source属性:

private void buttonRefresh_Click(object sender, RoutedEventArgs e)
{
    var uri = new Uri("ms-appdata:///local/help.html");
    webView.Source = uri;
}

结果:

System.ArgumentException: Value does not fall within the expected range.
   at Windows.UI.Xaml.Controls.WebView.put_Source(Uri value)
   at SimpleUwpApp.Proxy.SimplerPage.buttonRefresh_Click(Object sender, RoutedEventArgs e)


- 在xaml中明确设置webView的Source属性:这是microsoft documentation中的确切示例。

<WebView x:Name="webView" Source="ms-appdata:///local/help.html" />

因此在启动时出现异常:

Windows.UI.Xaml.Markup.XamlParseException: The text associated with this error code could not be found.

Failed to assign to property 'Windows.UI.Xaml.Controls.WebView.Source' because the type 'Windows.Foundation.String' cannot be assigned to the type 'Windows.Foundation.Uri'. [Line: 16 Position: 54]
   at Windows.UI.Xaml.Application.LoadComponent(Object component, Uri resourceLocator, ComponentResourceLocation componentResourceLocation)
   at SimpleUwpApp.Proxy.SimplerPage.InitializeComponent()


- 直接在Navigate()参数中使用url字符串进行尝试,例如此microsoft examplesNavigate()仅接受Uri作为参数,因此文档无效xaml工具包的版本。

webView.Navigate("ms-appx-web:///help.html");

结果:

Syntax error.

我临时提出的唯一解决方案是使用某种文件管理器并使用NavigateToString()方法读取html文件的内容:

var content = fileManager.Read("help.html"); // Manually read the content of html file
webView.NavigateToString(content);


所以问题是为什么描述的例子不起作用?如何避免使用NavigateToString?

2 个答案:

答案 0 :(得分:5)

所以我有两件不同的东西,对我有用:

XAML版本:

scala> val (key, val) =  "key1" -> "val1"
<console>:1: error: illegal start of simple pattern
val (key, val) =  "key1" -> "val1"
          ^

您需要使用<WebView x:Name="webView" Source="ms-appx-web:///help.html"/> 前缀。

代码隐藏版本:

ms-appx-web

与您的版本的不同之处在于,您不能仅输入字符串。您需要创建webView.Navigate(new Uri("ms-appx-web:///help.html")); - Class的新对象。

在这两个版本中,Uri - 文件是项目的直接子项,项目是html [你没有说,如果你使用的是Windows 8或Windows 10]

答案 1 :(得分:5)

解决方案provided by TheTanic适用于随包一起提供的文件。对于存储在 LocalFolder TemporaryFolder 中的文件,您必须follow special URI scheme

  

此方案的WebView支持要求您将内容放在本地或临时文件夹下的子文件夹中。这样可以导航到统一资源标识符(URI),例如ms-appdata:///local/folder/file.html和ms-appdata:///temp/folder/file.html

这意味着,如果您使用 LocalFolder ,那么URI将以这样的方式开始:ms-appdata:///local/之后必须是文件夹并且在您的文件中。这是一个工作样本:

StorageFile file = await StorageFile.GetFileFromApplicationUriAsync(new Uri("ms-appx:///help.html"));
StorageFolder folder = await ApplicationData.Current.LocalFolder.CreateFolderAsync("anyFolder", CreationCollisionOption.OpenIfExists);
await file.CopyAsync(folder, "help.html", NameCollisionOption.ReplaceExisting);
webView.Navigate(new Uri("ms-appdata:///local/anyFolder/help.html"));

另请注意,所有使用的内容也必须位于该文件夹中:

  

这些第一级子文件夹中的每一个都与其他第一级子文件夹中的内容隔离。