【发布时间】:2020-10-11 21:39:02
【问题描述】:
我有一个 C# Xamarin Forms 应用程序,它有一个非常简单的 Xaml 页面,其中包含一个 WebView 控件,当我将它作为 UWP 应用程序运行时,它不会呈现我创建的 HTML 页面。此 HTML 页面的先前版本在 UWP 版本中运行良好,但我添加了一些异步 JavaScript 代码,也许还有一些其他有问题的 JavaScript,现在我在 Xamarin Forms UWP 应用程序中得到一个空白页面,没有任何渲染。同样的 HTML 页面在 Edge 浏览器中运行良好,并且当作为在 Android 模拟器中运行的 Android 应用程序运行时,因此它似乎是 UWP 中的 WebView 控件的问题,其中包含我在下面包含的特定 HTML。我在 UWP 清单中打开了 Internet 和麦克风功能。
我正在使用 Xamarin Forms 4.7.0.968 和 Xamarin Essentials 1.5.3.2 和 Microsoft.NETCore.Universal 6.2.10 在 Visual Studio 2019 中对此进行测试。
[更新:遵循调试提示,现在看到一个错误][没有抛出错误或异常,所以我不知道问题是什么。任何人都知道为什么下面的 HTML 页面不会在 UWP 应用程序中呈现,或者我可以做些什么来调试......我希望我在浏览器中有类似 F12 工具的东西,这样我就可以知道出了什么问题。]
按照 (Nico Zhu - MSFT) 的调试提示后,我看到的错误与调用 createDirectLineSpeechAdapters() 的参数一致。显然,UWP WebView 不满意将 async() 函数作为参数传递给 createDirectLineSpeechAdapters():
此应用的 Android 版本中的 Edge 浏览器和 WebView 控件都可以正常工作,因此我试图了解为什么这是 WebView 的 UWP 实现的问题。
以下是不会随其后的 XAML 呈现的 HTML 代码:
<!DOCTYPE html>
<html>
<head>
<script crossorigin="anonymous"
src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"></script>
<style>
html,
body {
height: 100%;
}
body {
margin: 0;
}
#webchat {
height: 100%;
width: 100%;
margin: 0;
}
</style>
</head>
<body>
<div id="webchat" role="main"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="https://cdn.botframework.com/botframework-webchat/latest/webchat-es5.js"></script>
<script>
(async function () {
const store = window.WebChat.createStore({}, ({ dispatch }) => next => action => {
if (action.type === 'DIRECT_LINE/CONNECT_FULFILLED') {
dispatch({
type: 'WEB_CHAT/SEND_EVENT',
payload: {
name: 'webchat/join',
value: {
language: window.navigator.language
}
}
});
}
return next(action);
});
const settings = {
locale: 'en-us',
store,
userID: 'MyUId'
};
let adapters = null;
const fetchCredentials = async () => {
const region = 'eastus';
const response = await fetch(`https://${region}.api.cognitive.microsoft.com/sts/v1.0/issuetoken`, {
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded; charset=utf-8',
'Ocp-Apim-Subscription-Key': '<my key>'
}
});
if (!response.ok) {
throw new Error('Failed to fetch authorization token.');
}
const authorizationToken = await response.text();
return { authorizationToken, region };
};
adapters = await window.WebChat.createDirectLineSpeechAdapters({
fetchCredentials
});
window.WebChat.renderWebChat(
{
...adapters,
...settings
},
document.getElementById('webchat'));
document.querySelector('#webchat > *').focus();
})().catch(err => console.error(err));
</script>
</body>
</html>
这是显示 WebView 外观的 XAML:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:windows="clr-namespace:Xamarin.Forms.PlatformConfiguration.WindowsSpecific;assembly=Xamarin.Forms.Core"
mc:Ignorable="d"
x:Class="Fasst.MainPage">
<StackLayout>
<StackLayout Orientation="Horizontal">
<Button Text="Assistant" Clicked="AssistantButton_Clicked" />
<Button Text="Map" Clicked="MapButton_Clicked" />
</StackLayout>
<BoxView x:Name="mapPane" IsVisible="false" Color="Blue" />
<!-- Place new controls here -->
<WebView x:Name="assistantPane" Source="https://fasstassistant-rhw.azurewebsites.net/Index" windows:WebView.IsJavaScriptAlertEnabled="true"/>
</StackLayout>
</ContentPage>
【问题讨论】:
-
能分享一下用于加载html内容的c#代码吗?
-
好的,我在原始问题中添加了该信息
标签: c# xamarin xamarin.forms uwp