devbox
Cpp五条
这个屌丝很懒，什么也没留下！
关注作者
热门标签
热门文章
当前位置:   article > 正文

WebView使用详解、H5网页视频全屏播放 、网页跳转空白_webview播放视频

作者：Cpp五条 | 2024-03-01 15:14:51

赞

踩

webview播放视频

转载请注明出处：WebView使用详解、H5网页视频全屏播放 、网页跳转空白_fragment webview全屏播放视频_Mr_Leixiansheng的博客-CSDN博客

内容：介绍webview的使用方法，介绍WebViewClient、WebChromeClient，H5网页视频全屏播放，网页跳转空白问题

最近做项目老爱和H5打交道，遇到了很多问题也踩了许多坑，今天在这儿总结下，方便后人乘凉。

关于安卓和H5交互可参考我之前的文章：原生与H5交互介绍

WebView基础设置

  1. private void initWebView() {
  2. 		mWebView.setWebViewClient(new MyWebViewClient());		//设置在WebView中打开链接，不设置则调用自带浏览器。主要针对View进行拦截处理
  3. 		mWebView.setWebChromeClient(new MyWebChromeClient());
  4.  
  5. 		WebSettings webSettings = mWebView.getSettings();
  6. 		webSettings.setJavaScriptEnabled(true);		//支持JS
  7. 		webSettings.setDomStorageEnabled(true);		  //启用dom内存，防止js加载失败
  8. 		webSettings.setAllowFileAccess(true);		//允许访问文件
  9. 		webSettings.setSupportZoom(true);		//支持缩放
  10. 		webSettings.setLoadWithOverviewMode(true);		//是否启动概述模式浏览界面，当页面宽度超过WebView显示宽度时，缩小页面适应WebView。默认false
  11. 		webSettings.setGeolocationEnabled(false);		//是否允许定位
  12. 		webSettings.setLoadsImagesAutomatically(true);		//是否加载图片
  13. //		webSettings.setCacheMode(WebSettings.LOAD_DEFAULT);		//设置缓存模式
  14. //		webSettings.setDefaultTextEncodingName("UTF-8");		//设置页面的编码格式，默认UTF-8
  15. 	}

WebViewClient主要是对view一系列操作进行监听拦截。包括：网页加载开始、网页加载完成、错误拦截处理。(代码中注释会详解，再次不多做介绍)

WebChromeClient主要是对浏览器进行监听。例如弹窗、是否显示支持全屏播放等。(代码中注释会详解，再次不多做介绍)

网页加载空白问题，我只在7.0及以上遇到，貌似是说证书错误，可能越往上安全性越高吧，按照下面处理下就行了

  1. /**
  2. 		 * HTTPS通信的网址（以https://开头的网站）出现错误时
  3. 		 * 证书错误拦截处理
  4. 		 * 安卓7.0需要
  5. 		 */
  6. 		@Override
  7. 		public void onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) {
  8. 			if(error.getPrimaryError() == android.net.http.SslError.SSL_INVALID ){// 校验过程遇到了bug
  9. 				handler.proceed();		//忽略错误继续加载
  10. 			}else{
  11. 				handler.cancel();		//取消加载
  12. 			}
  13. 		}

视频全屏播放：安卓不像IOS一样可以直接全屏播放，需要在WebChromeClient对其进行设置，相当于是new 一个Fragment让其来进行全屏播放

  1. 	/*** 视频播放相关的方法 **/
  2. 		@Override
  3. 		public View getVideoLoadingProgressView() {
  4. 			FrameLayout frameLayout = new FrameLayout(MainActivity.this);
  5. 			frameLayout.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
  6. 			return frameLayout;
  7. 		}
  8.  
  9. 		@Override
  10. 		public void onShowCustomView(View view, CustomViewCallback callback) {
  11. 			showCustomView(view, callback);
  12. 		}
  13.  
  14. 		@Override
  15. 		public void onHideCustomView() {
  16. 			hideCustomView();
  17. 		}

   

代码如下：

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     xmlns:app="http://schemas.android.com/apk/res-auto"
  4.     xmlns:tools="http://schemas.android.com/tools"
  5.     android:layout_width="match_parent"
  6.     android:layout_height="match_parent"
  7.     android:orientation="vertical">
  8.  
  9.     <Button
  10.         android:id="@+id/btn_load"
  11.         android:layout_width="match_parent"
  12.         android:layout_height="wrap_content"
  13.         android:text="LOAD"/>
  14.  
  15.     <RelativeLayout
  16.         android:layout_width="match_parent"
  17.         android:layout_height="match_parent">
  18.  
  19.         <WebView
  20.             android:id="@+id/web_view"
  21.             android:layout_width="match_parent"
  22.             android:layout_height="match_parent">
  23.         </WebView>
  24.  
  25.         <ProgressBar
  26.             android:id="@+id/pb_loading"
  27.             android:layout_width="wrap_content"
  28.             android:layout_height="wrap_content"
  29.             android:layout_centerInParent="true"
  30.             android:visibility="gone"/>
  31.     </RelativeLayout>
  32.  
  33. </LinearLayout>
  1. package com.example.leixiansheng.webviewtest;
  2.  
  3. import android.Manifest;
  4. import android.content.Context;
  5. import android.content.Intent;
  6. import android.graphics.Bitmap;
  7. import android.net.Uri;
  8. import android.net.http.SslError;
  9. import android.os.Build;
  10. import android.os.Bundle;
  11. import android.support.annotation.NonNull;
  12. import android.support.v4.app.ActivityCompat;
  13. import android.support.v7.app.AppCompatActivity;
  14. import android.text.TextUtils;
  15. import android.util.Log;
  16. import android.view.KeyEvent;
  17. import android.view.MotionEvent;
  18. import android.view.View;
  19. import android.view.ViewGroup;
  20. import android.view.WindowManager;
  21. import android.webkit.JsPromptResult;
  22. import android.webkit.JsResult;
  23. import android.webkit.SslErrorHandler;
  24. import android.webkit.ValueCallback;
  25. import android.webkit.WebChromeClient;
  26. import android.webkit.WebResourceError;
  27. import android.webkit.WebResourceRequest;
  28. import android.webkit.WebSettings;
  29. import android.webkit.WebView;
  30. import android.webkit.WebViewClient;
  31. import android.widget.Button;
  32. import android.widget.FrameLayout;
  33. import android.widget.ProgressBar;
  34.  
  35. import com.tbruyelle.rxpermissions2.Permission;
  36. import com.tbruyelle.rxpermissions2.RxPermissions;
  37.  
  38. import java.util.function.Consumer;
  39.  
  40. import butterknife.BindView;
  41. import butterknife.ButterKnife;
  42. import butterknife.OnClick;
  43.  
  44. public class MainActivity extends AppCompatActivity {
  45.  
  46. 	@BindView(R.id.btn_load)
  47. 	Button mBtnLoad;
  48. 	@BindView(R.id.web_view)
  49. 	WebView mWebView;
  50. 	@BindView(R.id.pb_loading)
  51. 	ProgressBar mPbLoading;
  52.  
  53. 	/** 视频全屏参数 */
  54. 	protected static final FrameLayout.LayoutParams COVER_SCREEN_PARAMS = new FrameLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);
  55. 	private View customView;
  56. 	private FrameLayout fullscreenContainer;
  57. 	private WebChromeClient.CustomViewCallback customViewCallback;
  58.  
  59. 	@Override
  60. 	protected void onCreate(Bundle savedInstanceState) {
  61. 		super.onCreate(savedInstanceState);
  62. 		setContentView(R.layout.activity_main);
  63. 		ButterKnife.bind(this);
  64. 		initWebView();
  65. 	}
  66.  
  67. 	private void initWebView() {
  68. 		mWebView.setWebViewClient(new MyWebViewClient());		//设置在WebView中打开链接，不设置则调用自带浏览器。主要针对View进行拦截处理
  69. 		mWebView.setWebChromeClient(new MyWebChromeClient());
  70.  
  71. 		WebSettings webSettings = mWebView.getSettings();
  72. 		webSettings.setJavaScriptEnabled(true);		//支持JS
  73. 		webSettings.setDomStorageEnabled(true);		  //启用dom内存，防止js加载失败
  74. 		webSettings.setAllowFileAccess(true);		//允许访问文件
  75. 		webSettings.setSupportZoom(true);		//支持缩放
  76. 		webSettings.setLoadWithOverviewMode(true);		//是否启动概述模式浏览界面，当页面宽度超过WebView显示宽度时，缩小页面适应WebView。默认false
  77. 		webSettings.setGeolocationEnabled(false);		//是否允许定位
  78. 		webSettings.setLoadsImagesAutomatically(true);		//是否加载图片
  79. //		webSettings.setCacheMode(WebSettings.LOAD_DEFAULT);		//设置缓存模式
  80. //		webSettings.setDefaultTextEncodingName("UTF-8");		//设置页面的编码格式，默认UTF-8
  81. 	}
  82.  
  83. 	@OnClick(R.id.btn_load)
  84. 	public void onViewClicked() {
  85. 		mWebView.loadUrl("http://www.baidu.com");
  86. 	}
  87.  
  88. 	@Override
  89. 	public boolean onKeyDown(int keyCode, KeyEvent event) {
  90.  
  91. 		if (keyCode == KeyEvent.KEYCODE_BACK) {
  92. 			//优先退出全屏播放
  93. 			if (customView != null) {
  94. 				hideCustomView();
  95. 				return true;
  96. 			} else {
  97. 				if (mWebView.canGoBack()) {
  98. 					mWebView.goBack();		//返回上个页面
  99. 					return true;
  100. 				} else {
  101. 					System.exit(0);		//退出程序
  102. 				}
  103. 			}
  104. 		}
  105. 		return super.onKeyDown(keyCode, event);
  106. 	}
  107.  
  108.  
  109. 	/**
  110. 	 * 针对网页进行拦截处理
  111. 	 */
  112. 	public class MyWebViewClient extends WebViewClient{
  113.  
  114. 		/**
  115. 		 *可以实现对网页中超链接的拦截
  116. 		 */
  117. 		@Override
  118. 		public boolean shouldOverrideUrlLoading(WebView view, String url) {
  119.  
  120. 			//例：拦截电话网址，直接调用本地电话
  121. 			if (url.contains("tel:")){
  122. 				startActivity(new Intent(Intent.ACTION_DIAL, Uri.parse(url)));
  123. 				return true;
  124. 			}
  125.  
  126. 			if (url.startsWith("http:") || url.startsWith("https:")) {
  127. 				view.loadUrl(url);
  128. 				return true;
  129. 			}
  130. 		/*	WebView.HitTestResult hitTestResult = view.getHitTestResult();
  131. 			//hitTestResult==null解决重定向问题
  132. 			if (!TextUtils.isEmpty(url) && hitTestResult == null) {
  133. 				view.loadUrl(url);
  134. 				return true;
  135. 			}*/
  136.  
  137. 			return super.shouldOverrideUrlLoading(view, url);
  138. 		}
  139.  
  140. 		/**
  141. 		 *开始加载
  142. 		 */
  143. 		@Override
  144. 		public void onPageStarted(WebView view, String url, Bitmap favicon) {
  145. 			super.onPageStarted(view, url, favicon);
  146. 			mPbLoading.setVisibility(View.VISIBLE);
  147. 		}
  148.  
  149. 		/**
  150. 		 * 结束加载
  151. 		 */
  152. 		@Override
  153. 		public void onPageFinished(WebView view, String url) {
  154. 			super.onPageFinished(view, url);
  155. 			mPbLoading.setVisibility(View.GONE);
  156. 		}
  157.  
  158. 		/**
  159. 		 * 加载错误的时候会产生这个回调
  160. 		 */
  161. 		@Override
  162. 		public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) {
  163. 			super.onReceivedError(view, errorCode, description, failingUrl);
  164. 			//TODO
  165. 		}
  166.  
  167. 		/**
  168. 		 * HTTPS通信的网址（以https://开头的网站）出现错误时
  169. 		 * 证书错误拦截处理
  170. 		 * 安卓7.0需要
  171. 		 */
  172. 		@Override
  173. 		public void onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) {
  174. 			if(error.getPrimaryError() == android.net.http.SslError.SSL_INVALID ){// 校验过程遇到了bug
  175. 				handler.proceed();		//忽略错误继续加载
  176. 			}else{
  177. 				handler.cancel();		//取消加载
  178. 			}
  179. 		}
  180. 	}
  181.  
  182. 	/**
  183. 	 * 针对浏览器拦截处理
  184. 	 */
  185. 	public class MyWebChromeClient extends WebChromeClient{
  186.  
  187. 		/**
  188. 		 * 弹窗拦截
  189. 		 */
  190. 		@Override
  191. 		public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
  192. 			return super.onJsAlert(view, url, message, result);
  193. 		}
  194.  
  195. 		/**
  196. 		 * 弹窗拦截
  197. 		 */
  198. 		@Override
  199. 		public boolean onJsConfirm(WebView view, String url, String message, JsResult result) {
  200. 			return super.onJsConfirm(view, url, message, result);
  201. 		}
  202.  
  203. 		/**
  204. 		 * 弹窗拦截
  205. 		 */
  206. 		@Override
  207. 		public boolean onJsPrompt(WebView view, String url, String message, String defaultValue, JsPromptResult result) {
  208. 			return super.onJsPrompt(view, url, message, defaultValue, result);
  209. 		}
  210.  
  211. 		/**
  212. 		 * 加载进度拦截
  213. 		 */
  214. 		@Override
  215. 		public void onProgressChanged(WebView view, int newProgress) {
  216. 			super.onProgressChanged(view, newProgress);
  217. 		}
  218.  
  219. 		/**
  220. 		 * 文件选择
  221. 		 */
  222. 		@Override
  223. 		public boolean onShowFileChooser(WebView webView, ValueCallback<Uri[]> filePathCallback, FileChooserParams fileChooserParams) {
  224. 			selectImage();
  225. 			return super.onShowFileChooser(webView, filePathCallback, fileChooserParams);
  226. 		}
  227.  
  228. 		/*** 视频播放相关的方法 **/
  229. 		@Override
  230. 		public View getVideoLoadingProgressView() {
  231. 			FrameLayout frameLayout = new FrameLayout(MainActivity.this);
  232. 			frameLayout.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
  233. 			return frameLayout;
  234. 		}
  235.  
  236. 		@Override
  237. 		public void onShowCustomView(View view, CustomViewCallback callback) {
  238. 			showCustomView(view, callback);
  239. 		}
  240.  
  241. 		@Override
  242. 		public void onHideCustomView() {
  243. 			hideCustomView();
  244. 		}
  245. 	}
  246.  
  247. 	/**
  248. 	 * 图片选择
  249. 	 */
  250. 	private void selectImage() {
  251. 		//TODO
  252. 	}
  253.  
  254. 	/**
  255. 	 * 视频播放全屏
  256. 	 */
  257. 	private void showCustomView(View view, WebChromeClient.CustomViewCallback callback) {
  258.  
  259. 		// if a view already exists then immediately terminate the new one
  260. 		if (customView != null) {
  261. 			callback.onCustomViewHidden();
  262. 			return;
  263. 		}
  264. 		getWindow().getDecorView();
  265.  
  266. 		//获取虚拟按键高度，防止遮挡
  267. 		if(ScreenUtils.hasNavBar(this)){
  268. 			COVER_SCREEN_PARAMS.setMargins(0,0,0,ScreenUtils.getNavigationBarHeight(this));
  269. 		}
  270.  
  271. 		FrameLayout decor = (FrameLayout) getWindow().getDecorView();
  272. 		fullscreenContainer = new FullscreenHolder(this);
  273. 		fullscreenContainer.addView(view, COVER_SCREEN_PARAMS);
  274. 		decor.addView(fullscreenContainer, COVER_SCREEN_PARAMS);
  275. 		customView = view;
  276. 		setStatusBarVisibility(false);
  277. 		customViewCallback = callback;
  278. 	}
  279.  
  280. 	/**
  281. 	 * 隐藏视频全屏
  282. 	 */
  283. 	private void hideCustomView() {
  284. 		if (customView == null) {
  285. 			return;
  286. 		}
  287. 		setStatusBarVisibility(true);
  288. 		FrameLayout decor = (FrameLayout) getWindow().getDecorView();
  289. 		decor.removeView(fullscreenContainer);
  290. 		fullscreenContainer = null;
  291. 		customView = null;
  292. 		customViewCallback.onCustomViewHidden();
  293. 		mWebView.setVisibility(View.VISIBLE);
  294. 	}
  295.  
  296. 	/**
  297. 	 * 全屏容器界面
  298. 	 */
  299. 	static class FullscreenHolder extends FrameLayout {
  300.  
  301. 		public FullscreenHolder(Context ctx) {
  302. 			super(ctx);
  303. 			setBackgroundColor(ctx.getResources().getColor(android.R.color.black));
  304. 		}
  305.  
  306. 		@Override
  307. 		public boolean onTouchEvent(MotionEvent evt) {
  308. 			return true;
  309. 		}
  310. 	}
  311.  
  312. 	private void setStatusBarVisibility(boolean visible) {
  313. 		int flag = visible ? 0 : WindowManager.LayoutParams.FLAG_FULLSCREEN;
  314. 		getWindow().setFlags(flag, WindowManager.LayoutParams.FLAG_FULLSCREEN);
  315. 	}
  316. }

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/Cpp五条/article/detail/174890
推荐阅读
相关标签

Copyright © 2003-2013 www.wpsshop.cn 版权所有，并保留所有权利。

  

闽ICP备14008679号