App端自动播放H5视频配置

iOS 自动播放配置

image.png

1、需要在初始化的位置配置下

// 是否允许内联或使用本机全屏控制器,默认是NO。

wkWebConfig.allowsInlineMediaPlayback = YES;

if (@available(iOS 10.0, *)) {
    wkWebConfig.mediaTypesRequiringUserActionForPlayback = WKAudiovisualMediaTypeNone;
} else {
    wkWebConfig.mediaTypesRequiringUserActionForPlayback = NO;
}

2、如果有些视频设置了上述代码还不会自动播放,配置WKWebview代理

(_wkwebView.navigationDelegate = self;)
在加载完成后代理方法里手动调用下
image.png

// 页面加载完成之后调用

- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation {
   
    [self playVideo];
}
- (void)playVideo{
    NSString *script = @"var videos = document.querySelectorAll(\"video\"); for (var i = videos.length - 1; i >= 0; i--) { var ivideo = videos[i]; ivideo.setAttribute(\"webkit-playsinline\",\"\"); ivideo.play(); };";
    [_wkwebView evaluateJavaScript:script completionHandler:nil];
    
}

Android 自动播放配置

WebSettings webSetting = webView.getSettings();
高版本https问题

webSetting.setMixedContentMode(WebSettings.MIXED_CONTENT_ALWAYS_ALLOW);
webSetting.setSupportMultipleWindows(false);
webSetting.setBlockNetworkImage(true);//解决图片不显示
webSetting.setJavaScriptEnabled(true); // 是否开启JS支持
webSetting.setAllowFileAccess(true); // 是否允许访问文件
webSetting.setDomStorageEnabled(true); // 是否节点缓存
webSetting.setDatabaseEnabled(true); // 是否数据缓存
webSetting.setAppCacheEnabled(true); // 是否应用缓存
webSetting.setMediaPlaybackRequiresUserGesture(false); // 是否要手势触发媒体 重点
webSetting.setTextZoom(100); // 设置文本缩放的百分比
webSetting.setLoadsImagesAutomatically(true); // 是否自动加载图片
webSetting.setDefaultTextEncodingName("UTF-8"); // 设置编码格
webSetting.setBlockNetworkLoads(false); // 是否从网络获取资源
webView.loadUrl("https://xxx");

你可能感兴趣的:(html5androidios)