Android Webview使用和遇到過的坑總結(jié)
正文
WebView 用來顯示網(wǎng)頁的一個View，它使用WebKit渲染引擎顯示web頁面，可以加載在線的或者本地的html頁面，WebView可以對頁面進行一系列操作，如歷史頁面的向前、向后，放大和縮小，執(zhí)行文本搜索，與JS交互等等;
在使用Webview時，請記得在AndroidManifest.xml文件中聲明INTERNET權(quán)限：
- <uses-permission android:name="android.permission.INTERNET" />
默認情況下，WebView不支持JavaScript，web頁面的錯誤也會被忽略，如果只是用Webview來顯示網(wǎng)頁而不用交互，默認配置就可以了，如果需要交互，就需要自定義配置了。
WebView初始化及加載URL
1、通過XML初始化：
- <WebView
- android:id="@+id/webview"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent"/>
或者直接New：
- WebView webview = new WebView(this);
2、加載URL：
- WebView myWebView = (WebView) findViewById(R.id.webview);
- myWebView.loadUrl("http://www.example.com");
或者可以直接加載Html：
- String summary = "<html><body>You scored <b>192</b> points.</body></html>";
- myWebView.loadData(summary, "text/html", null);
如果在加載URL的時候想添加Header信息，可以復(fù)寫loadUrl()方法，如：
- @Override public void loadUrl(String url) {
- Map<String, String> map = new HashMap<String, String>();
- map.put("ajax", "true");
- map.put("appversion", SharedPreferencesUtil.getAppVersion(getContext())); map.put("clientid", SharedPreferencesUtil.getClientId(getContext()));
- loadUrl(url, map);
- }
WebSettings
WebSettings 中可以對WebView進行一系列配置，如：
- WebSettings settings = getSettings(); //默認是false 設(shè)置true允許和js交互
- settings.setJavaScriptEnabled(true); // WebSettings.LOAD_DEFAULT 如果本地緩存可用且沒有過期則使用本地緩存，否加載網(wǎng)絡(luò)數(shù)據(jù) 默認值
- // WebSettings.LOAD_CACHE_ELSE_NETWORK 優(yōu)先加載本地緩存數(shù)據(jù)，無論緩存是否過期
- // WebSettings.LOAD_NO_CACHE 只加載網(wǎng)絡(luò)數(shù)據(jù)，不加載本地緩存
- // WebSettings.LOAD_CACHE_ONLY 只加載緩存數(shù)據(jù)，不加載網(wǎng)絡(luò)數(shù)據(jù)
- //Tips:有網(wǎng)絡(luò)可以使用LOAD_DEFAULT 沒有網(wǎng)時用LOAD_CACHE_ELSE_NETWORK
- settings.setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK); //開啟 DOM storage API 功能 較大存儲空間，使用簡單
- settings.setDomStorageEnabled(true); //設(shè)置數(shù)據(jù)庫緩存路徑 存儲管理復(fù)雜數(shù)據(jù) 方便對數(shù)據(jù)進行增加、刪除、修改、查詢 不推薦使用
- settings.setDatabaseEnabled(true); final String dbPath = context.getApplicationContext().getDir("db", Context.MODE_PRIVATE).getPath();
- settings.setDatabasePath(dbPath); //開啟 Application Caches 功能 方便構(gòu)建離線APP 不推薦使用
- settings.setAppCacheEnabled(true); final String cachePath = context.getApplicationContext().getDir("cache", Context.MODE_PRIVATE).getPath();
- settings.setAppCachePath(cachePath);
- settings.setAppCacheMaxSize(5 * 1024 * 1024);
Webview中可以設(shè)置的幾種緩存對比：
WebviewClient
WebCromeClient常用方法：
1、shouldOverrideUrlLoading(WebView view, String url)
在API 24以后過時，當一個url即將被webview加載時，給Application一個機會來接管處理這個url，方法返回true代表Application自己處理url;返回false代表Webview處理url。
舉個例子，項目中需要處理傳過來的URL是一個事件還是一個HTTP鏈接，可以通過自定義協(xié)議頭 (nativeapi://) 來過濾，如：
- @Override
- public boolean shouldOverrideUrlLoading(WebView view, String url) {
- Uri uri = Uri.parse(url);
- String scheme = uri.getScheme();
- if (TextUtils.isEmpty(scheme)) return true;
- if (scheme.equals("nativeapi")) {
- //如定義nativeapi://showImg是用來查看大圖，這里添加查看大圖邏輯
- return true;
- } else if (scheme.equals("http") || scheme.equals("https")) {
- //處理http協(xié)議
- if (Uri.parse(url).getHost().equals("www.example.com")) {
- // 內(nèi)部網(wǎng)址，不攔截，用自己的webview加載
- return false;
- } else {
- //跳轉(zhuǎn)外部瀏覽器
- Intent intent = new Intent(Intent.ACTION_VIEW, uri);
- context.startActivity(intent);
- return true;
- }
- } return super.shouldOverrideUrlLoading(view, url);
- }
注：如果使用的是Post請求方式，則此方法不會被回調(diào)
2、shouldOverrideUrlLoading(WebView view, WebResourceRequest request)
在API 24以后新加的，使用同上。
3、shouldInterceptRequest(WebView view, String url)
在API 21以后過時，通知Application加載資源的請求并返回請求的資源，如果返回值是Null，Webview仍然會按正常加載資源;否則返回的數(shù)據(jù)將會被使用。
注：回調(diào)發(fā)生在子線程中,不能直接進行UI操作
4、shouldInterceptRequest(WebView view, WebResourceRequest request)
在API 21以后新加，使用同上。
5、onPageStarted(WebView view, String url, Bitmap favicon)
通知Application頁面已經(jīng)開始加載資源，頁面加載過程中，onPageStarted至多會被執(zhí)行一次。
6、onPageFinished(WebView view, String url)
通知Application頁面已經(jīng)加載完畢。
7、onReceivedError(WebView view, int errorCode, String description, String failingUrl)
通知Application有錯誤發(fā)生，這些錯誤是不可恢復(fù)的(即主要的資源不可用)。errorCode參數(shù)對應(yīng)于一個ERROR_ *常量
WebCromeClient
1、onProgressChanged(WebView view, int newProgress)
通知Application的加載進度，newProgress取值范圍[0,100]，可以通過這個方法來編寫一個帶加載進度條的Webview，具體例子請參考：Android 編寫一個帶進度條的Webview
2、onReceivedTitle(WebView view, String title)
當加載頁面標題有改變時會通知Application，title即為新標題。
控制Webview加載歷史網(wǎng)頁
WebView重寫URL加載時,它會自動累積的歷史訪問的web頁面?？梢酝ㄟ^向后goBack()和向前goForward()。
舉例，可以在Activity中的回退鍵控制向后回退到前一個頁面：
- @Override
- public boolean onKeyDown(int keyCode, KeyEvent event) {
- // Check if the key event was the Back button and if there's history
- if ((keyCode == KeyEvent.KEYCODE_BACK) && webview.canGoBack()) {
- webview.goBack();
- return true;
- } // If it wasn't the Back key or there's no web page history, bubble up to the default
- // system behavior (probably exit the activity)
- return super.onKeyDown(keyCode, event);
- }
Webview和Js交互
1、Js調(diào)用Android接口：
- public class WebAppInterface {
- Context mContext;
- /** Instantiate the interface and set the context */
- WebAppInterface(Context c) {
- mContext = c;
- } /** Show a toast from the web page */
- @JavascriptInterface
- public void showToast(String toast) {
- Toast.makeText(mContext, toast, Toast.LENGTH_SHORT).show();
- }
- }
SDK>=17(Android4.2)以上，必須添加@JavascriptInterface聲明，然后通過 addJavascriptInterface() 方式供Js調(diào)用，如：
- webView.addJavascriptInterface(new WebAppInterface(this), "android");
通過上面的配置，就可以在Js中調(diào)用了：
- <input type="button" value="Say hello" onClick="showAndroidToast('Hello Android!')" />
- <script type="text/javascript">
- function showAndroidToast(toast) {
- //調(diào)用Android中的showToast方法
- Android.showToast(toast);
- }</script>
2、Android調(diào)用Js的接口：
可以通過webview.loadUrl("javascript:JsMethod()")方式加載Js接口，如果有參數(shù)，直接加到JsMethod()里面即可，下面封裝了兩個方法，分別是加載帶參數(shù)和不帶參數(shù)的Js函數(shù)：
- /**
- * 加載帶參數(shù)的JS函數(shù)
- *
- * @param JsName JS函數(shù)名
- * @param params 不定參數(shù)
- */
- public void loadJSWithParam(String JsName, String... params) {
- String TotalParam = "";
- for (int i = 0; i < params.length; i++) {
- if (i == params.length - 1) {
- //***一個
- TotalParam += (params[i]);
- } else {
- TotalParam += (params[i] + "','");
- }
- } this.loadUrl("javascript:" + JsName + "('" + TotalParam + "')");
- } /**
- * 加載不帶參數(shù)的JS函數(shù)
- *
- * @param JsName JS函數(shù)名
- */
- public void loadJS(String JsName) {
- this.loadUrl("javascript:" + JsName + "()");
- }
Webview的一些優(yōu)化和遇到的坑
1、Webview打開一個鏈接，播放一段音樂，退出Activity時音樂還在后臺播放，可以通過在Activity的onPause中調(diào)用webview.onPause()解決，并在Activity的onResume中調(diào)用webview.onResume()恢復(fù)，如下：
- @Override
- protected void onPause() {
- h5_webview.onPause();
- h5_webview.pauseTimers();
- super.onPause();
- } @Override
- protected void onResume() {
- h5_webview.onResume();
- h5_webview.resumeTimers();
- super.onResume();
- }
Webview的onPause()方法官網(wǎng)是這么解釋的：
Does a best-effort attempt to pause any processing that can be paused safely, such as animations and geolocation. Note that this call does not pause JavaScript. To pause JavaScript globally, use pauseTimers(). To resume WebView, call onResume().
通知內(nèi)核嘗試停止所有處理，如動畫和地理位置，但是不能停止Js，如果想全局停止Js，可以調(diào)用pauseTimers()全局停止Js，調(diào)用onResume()恢復(fù)。
2、5.0 以后的WebView加載的鏈接為Https開頭，但是鏈接里面的內(nèi)容，比如圖片為Http鏈接，這時候，圖片就會加載不出來，解決方法：
- if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
- webSetting.setMixedContentMode(webSetting.getMixedContentMode());
- }
原因是5.0之后不支持Https和Http的混合模式，具體可參看：Android5.0 WebView中Http和Https混合問題
3、WebView與JavaScript相互調(diào)用時，如果是debug沒有配置混淆時，調(diào)用時沒問題的，但是當設(shè)置混淆后發(fā)現(xiàn)無法正常調(diào)用了，解決方法：
在proguard-rules.pro文件中配置：
- -keepattributes *Annotation*
- -keepattributes *JavascriptInterface*
- -keep public class org.mq.study.webview.DemoJavaScriptInterface{
- public <methods>;
- }
如果是內(nèi)部類：
- -keepattributes *Annotation*
- -keepattributes *JavascriptInterface*
- -keep public class org.mq.study.webview.webview.DemoJavaScriptInterface$InnerClass{
- public <methods>;
- }
