Question

我有一个使用WebView的Xamarin Forms（4.2）应用程序。这是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"
             mc:Ignorable="d"
             BackgroundColor="#66B1D1"
             NavigationPage.HasNavigationBar="False"
             x:Class="ParentsApp.Pages.WebViewPage">
    <ContentPage.Content>
        <AbsoluteLayout>
            <Grid AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="0,1,1,1">
                <StackLayout>
                    <WebView x:Name="WebView" Source="https://www.testsite.com/testvideo.aspx"></WebView>
                </StackLayout>
            </Grid>
        </AbsoluteLayout>
    </ContentPage.Content>
</ContentPage>

WebViews源指向包含视频的基本HTML页面：

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
             <video poster="https://ljtest.blob.core.windows.net/test/b5de01eb-2ecd-41e8-a7d6-2099b11ebbcd_thumbnail.jpg" style="max-height: 345px; max-width: 614px;" controls preload="none" loop muted>
                <source src="https://ljtest.blob.core.windows.net/test/b5de01eb-2ecd-41e8-a7d6-2099b11ebbcd_converted.mp4" type="video/mp4">
             </video>
        </div>
    </form>
</body>
</html>

我们看到带有播放图标的视频缩略图，单击该图标会反应，但视频无法播放。

我有一部iPhone 5s（12.4.3），iPhone X（13.1）和iPad（第五代13.2.3）。如果我在同一iOS设备上打开Safari，并转到视频播放的html页面。

视频可以在Android设备上播放。

11月28日更新

我创建了一个解决方案，其中包含基本的Xamarin表单应用程序（仅包含WebView）和基本的Web应用程序（包含视频元素的单个html页面），您可以在github上看到它

我还阅读了有关最新的iOS video policies的信息，认为可能与之相关，但是要重申一下，如果我在我们的任何iOS设备上使用Safari浏览器，并导航到Xamarin WebView指向视频播放的页面。 / p>

在生产中，视频将托管在Azure存储中。为了排除任何可能的问题，此示例中的缩略图和视频都托管在测试网站上。

Answer 1

您可以尝试使用WkWebView并将MediaPlaybackRequiresUserAction设置为false来解决您的问题吗？

在custom renderer中：

[assembly: ExportRenderer(typeof(CustomWebView), typeof(MyCustomWebViewRenderer))]
namespace App1.iOS
{
    public class MyCustomWebViewRenderer : ViewRenderer<CustomWebView, WKWebView>
    {
        protected override void OnElementChanged(ElementChangedEventArgs<CustomWebView> e)
        {
            base.OnElementChanged(e);

            if (Control == null)
            {
                var webView = new WKWebView(Frame, new WKWebViewConfiguration() { MediaPlaybackRequiresUserAction = false});
                SetNativeControl(webView);
            }
            if (e.NewElement != null)
            {
                Control.LoadRequest(new NSUrlRequest(new NSUrl(Element.Uri)));
            }
        }
    }
}

还有customWebView：

public class CustomWebView : WebView
{
    public static readonly BindableProperty UriProperty = BindableProperty.Create(
        propertyName: "Uri",
        returnType: typeof(string),
        declaringType: typeof(CustomWebView),
        defaultValue: default(string));

    public string Uri
    {
        get { return (string)GetValue(UriProperty); }
        set { SetValue(UriProperty, value); }
    }
}

在Xaml中：

<StackLayout>
    <app1:CustomWebView Source="https://videotest2019.azurewebsites.net/" Uri="https://videotest2019.azurewebsites.net/" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" />
</StackLayout>

Xamarin Forms Webview html视频无法在iOS设备上播放

1 个答案: