1. WebView简介

WebView在Android平台上是一个特殊的View，基于webkit引擎、展示web页面的控件，app中显示的是一张网页，提供了网页的前进、后退、放大、缩小、搜索。WebView在低版本和高版本分别采用不同的 webkit 版本内核，4.4之后直接使用 Chrome。

现在很多的App都内置Webview网页，比如淘宝、京东、聚划算等app。

2. WebView特点

1>：比较灵活，不需要升级客户端，直接修改网页代码即可；
2>：一些经常变化的页面可以用WebView这种方式去加载网页，比如中秋、国庆打开的页面不一样，如果用WebView显示的话，直接修改Web网页代码即可，不需要客户端升级；
3>：直接加载url、直接使用本地html文件（sd卡、assets目录下）、txt文件都可以；
4>：html可以直接和原生app交互；

3. 加载html的4种方式如下

图片.png

4. WebViewClient与WebChromeClient区别？

1>：WebViewClient：只是帮助WebView处理各种事件通知、请求事件，常用方法如下：

A：onPageStart()：页面开始加载；
B：onPageFinish()：页面加载完毕；
C：onReceivedError()：访问错误时回调，比如访问网页报错404，在这个方法回调时候可以加载错误页面；
D：shouldOverrideUrlLoading()：拦截url；

/**
     * WebViewClient：主要帮助WebView处理各种通知、请求事件的
     */
    public class MyWebViewClient extends WebViewClient {

        /**
         * 页面请求完成
         */
        @Override
        public void onPageFinished(WebView view, String url) {

        }

        /**
         * 拦截url
         */
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            return false;
        }


        /**
         * 页面开始加载
         */
        @Override
        public void onPageStarted(WebView view, String url, Bitmap favicon) {
            super.onPageStarted(view, url, favicon);
            myWebViewLoadHandler.sendEmptyMessage(LOAD_START);
        }


        /**
         * 访问错误时回调，比如访问网页时报错404，在这个方法回调的时候可以加载错误页面
         */
        @Override
        public void onReceivedError(WebView view, WebResourceRequest request, WebResourceError error) {
            super.onReceivedError(view, request, error);
            myWebViewLoadHandler.sendEmptyMessage(LOAD_END);
        }


        /**
         * webview处理https的SSL证书设置
         */
        @Override
        public void onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) {
            super.onReceivedSslError(view, handler, error);
        }
    }

2>：WebChromeClient：主要帮助WebView处理 JavaScript的对话框、网页Title、网页icon图标、加载进度，常用方法如下：

A：onReceivedTitle()：获取网页标题；
B：onReceivedIcon()：获取网页图标；
C：onProgressChanged()：加载进度的回调；
D：onJsAlert()：webview不支持js的alert弹窗，需要自己监听然后通过dialog弹窗；

    /**
     * 主要帮助WebView处理JavaScript的对话框、网站图标、网站title、加载进度
     */
    public class MyChromeClient extends WebChromeClient {

        /**
         *  加载进度回调
         */
        @Override
        public void onProgressChanged(WebView view, int newProgress) {
            if (newProgress >= 100) {
                myWebViewLoadHandler.sendEmptyMessage(LOAD_END);
            }
            super.onProgressChanged(view, newProgress);
        }


        /**
         * 获取网页标题
         */
        @Override
        public void onReceivedTitle(WebView view, String title) {
            super.onReceivedTitle(view, title);
        }


        /**
         * 获取网页icon图标
         */
        @Override
        public void onReceivedIcon(WebView view, Bitmap icon) {
            super.onReceivedIcon(view, icon);
        }


        /**
         * webview不支持js的alert弹窗，需要自己监听然后通过dialog弹窗
         */
        @Override
        public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
            return super.onJsAlert(view, url, message, result);
        }
    }

5. 部分方法解释

1>： 如果webview已经点击链接看了很多页了，且不做任何处理，那么点击系统 "Back"键，整个浏览器会调用finish()而结束自身，如果希望浏览的网页是回退而不是退出整个浏览器，需要覆盖当前Activity类的onKeyDown()：

@Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        // 监听返回键
        if (keyCode == KeyEvent.KEYCODE_BACK || keyCode == KeyEvent.KEYCODE_SEARCH) {
            try {
                if (mWebView.canGoBack()) {
                    mWebView.goBack();
                } else {
                    startNext();
                }
            } catch (Exception e) {
            }
        }
        return false;
    }

    private void startNext() {
        finish();
    }

2>： 后台无法释放js，导致耗电：

如果html中 有一些js一直在执行动画之类的东西，此时如果webview被挂在了后台，用户无法感知，这些资源没有被释放，导致一直占有 CPU，耗电非常快，这种情况可以在onResume()和onStop()方法中 把 setJavaScriptEnable()设置成true和false；

@SuppressLint("SetJavaScriptEnabled")
    @Override
    protected void onResume() {
        super.onResume();
        if (mWebView != null) {
            mWebView.getSettings().setJavaScriptEnabled(true);
        }
    }

    @Override
    protected void onStop() {
        super.onStop();
        if (mWebView != null) {
            mWebView.getSettings().setJavaScriptEnabled(false);
        }
    }

3>：解决webview引起的内存泄露：

A：有时候WebView引起的内存泄露还是比较严重的，尤其是当加载的页面比较庞大的时候，可以参考qq或者微信做法，做法如下：
单独开一个进程使用WebView，并且当这个WebView结束的时候，手动调用 System.exit(0)，这个是目前对于内存泄露最好的解决办法，可以解决webview引起的资源无法释放等问题；
B：需要在onDestroy()中的操作：
a：清除webview的历史；
b：从父容器中移除；
c：调用destroy()；
d：最后将其置为null；

@Override
    protected void onDestroy() {
        if (mWebView != null) {
            //mWebView.loadDataWithBaseURL(null, "", "text/html", "utf-8", null);
            mWebView.clearHistory();
            ViewGroup parent = (ViewGroup) mWebView.getParent();
            if (parent != null) {
                parent.removeView(mWebView);
            }
            mWebView.destroy();
            mWebView = null;
        }
        super.onDestroy();
    }

4>：处理https请求

在WebViewClient中：

        /**
         * webview处理https的SSL证书设置
         */
        @Override
        public void onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) {
            super.onReceivedSslError(view, handler, error);
        }

5>：getSettings().setBuiltInZoomControls(true)引起的crash：

这个方法调用后，如果触摸屏幕，弹出那个提示框还没消失的时候，如果Activity结束了，就报错了，3.0以上4.4以下可能会出现这种情况，为了规避它，需要在onDestroy()中将webiew设置成 setVisibility(View.GONE)；

6. WebView的一种写法

public class MainActivity  extends AppCompatActivity {

    private WebView mWebView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.act_main);
        initView();
    }

    private void initView() {
        mWebView = (WebView) findViewById(R.id.wb);
        mWebView.getSettings().setJavaScriptEnabled(true);//支持javascript
        mWebView.requestFocus();//触摸焦点起作用
        mWebView.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);//取消滚动条
        mWebView.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);//设置允许js弹出alert对话框
        //load本地
        mWebView.loadUrl("file:///android_asset/hellotest.html");
        //load在线
        //mWebView.loadUrl("http://www.google.com");
        //js访问android，定义接口
        mWebView.addJavascriptInterface(new JsInteration(), "control");
        //设置了Alert才会弹出，重新onJsAlert（）方法return true可以自定义处理信息
        mWebView.setWebChromeClient(new WebChromeClient() {
            @Override
            public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
                //return super.onJsAlert(view, url, message, result);
                Toast.makeText(MainActivity.this, message, Toast.LENGTH_LONG).show();
                return true;
            }
        });
        mWebView.setWebViewClient(new WebViewClient() {
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                //在当前的webview中跳转到新的url
                view.loadUrl(url);
                //启动手机浏览器来打开新的url
//                Intent i = new Intent(Intent.ACTION_VIEW);
//                i.setData(Uri.parse(url));
//                startActivity(i);
                return true;
            }

            //载入页面开始的事件
            @Override
            public void onPageStarted(WebView view, String url, Bitmap favicon) {
                super.onPageStarted(view, url, favicon);
            }

            // 载入页面完成的事件
            @Override
            public void onPageFinished(WebView view, String url) {
                super.onPageFinished(view, url);
            }

            //webView默认是不处理https请求的，页面显示空白，需要进行如下设置：
            @Override
            public void onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) {
                handler.proceed();//如果只是简单的接受所有证书的话，就直接调process()方法就行了
                // handler.cancel();
                // handler.handleMessage(null); } });
            }
        });

    }

    /**
     * android调用js无参无返回值函数
     *
     * @param view
     */
    public void Android2JsNoParmNoResult(View view) {
        final String call = "javascript:sayHello()";
        mWebView.post(new Runnable() {
            @Override
            public void run() {
                mWebView.loadUrl(call);
            }
        });

    }

    /**
     * android调用js有参无返回值函数
     *
     * @param view
     */
    public void Android2JsHaveParmNoResult(View view) {
        final String call = "javascript:alertMessage(\"" + "我是android传过来的内容,hey man" + "\")";
        mWebView.post(new Runnable() {
            @Override
            public void run() {
                mWebView.loadUrl(call);
            }
        });
    }

    /**
     * android调用js有参有返回值函数（4.4之前）
     *
     * @param view
     */
    public void Android2JsHaveParmHaveResult(View view) {
        final String call = "javascript:sumToJava(1,2)";
        mWebView.post(new Runnable() {
            @Override
            public void run() {
                mWebView.loadUrl(call);
            }
        });
    }

    /**
     * android调用js有参有返回值函数（4.4之后）
     * evaluateJavascript方法必须在UI线程（主线程）调用，因此onReceiveValue也执行在主线程
     *
     * @param view
     */
    @TargetApi(Build.VERSION_CODES.KITKAT)
    public void Android2JsHaveParmHaveResult2(View view) {
        mWebView.evaluateJavascript("sumToJava2(3,4)", new ValueCallback<String>() {
            @Override
            public void onReceiveValue(String Str) {
                Toast.makeText(getApplicationContext(), "我是android调用js方法(4.4后)，入参是3和4，js返回结果是" + Str, Toast.LENGTH_LONG).show();
            }
        });
    }

    /**
     * 获取网页图片并放大显示
     *
     * @param view
     */
    public void clickPhoto(View view) {
        startActivity(new Intent(this, WithPhotoWebActivity.class));
    }

    /**
     * js调用android的方法
     */
    class JsInteration {
        @JavascriptInterface
        public void toastMessage(String message) {
            Toast.makeText(getApplicationContext(), message, Toast.LENGTH_LONG).show();
        }

        @JavascriptInterface
        public void onSumResult(int result) {
            Toast.makeText(getApplicationContext(), "我是android调用js方法(4.4前)，入参是1和2，js返回结果是" + result, Toast.LENGTH_LONG).show();
        }
    }

    /**
     * 网页回退
     *
     * @param keyCode
     * @param event
     * @return
     */
    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if (keyCode == KeyEvent.KEYCODE_BACK && mWebView.canGoBack()) {
            mWebView.goBack();// 返回前一个页面
            return true;
        }
        return super.onKeyDown(keyCode, event);
    }

    @Override
    protected void onDestroy() {
        if(mWebView!=null) {
            mWebView.setVisibility(View.GONE);
            mWebView.removeAllViews();
            mWebView.destroy();
            releaseAllWebViewCallback();
        }
        super.onDestroy();
    }

    /**
     * 防止内存泄露
     */
    public void releaseAllWebViewCallback() {
        if (android.os.Build.VERSION.SDK_INT < 16) {
            try {
                Field field = WebView.class.getDeclaredField("mWebViewCore");
                field = field.getType().getDeclaredField("mBrowserFrame");
                field = field.getType().getDeclaredField("sConfigCallback");
                field.setAccessible(true);
                field.set(null, null);
            } catch (NoSuchFieldException e) {
                if (BuildConfig.DEBUG) {
                    e.printStackTrace();
                }
            } catch (IllegalAccessException e) {
                if (BuildConfig.DEBUG) {
                    e.printStackTrace();
                }
            }
        } else {
            try {
                Field sConfigCallback = Class.forName("android.webkit.BrowserFrame").getDeclaredField("sConfigCallback");
                if (sConfigCallback != null) {
                    sConfigCallback.setAccessible(true);
                    sConfigCallback.set(null, null);
                }
            } catch (NoSuchFieldException e) {
                if (BuildConfig.DEBUG) {
                    e.printStackTrace();
                }
            } catch (ClassNotFoundException e) {
                if (BuildConfig.DEBUG) {
                    e.printStackTrace();
                }
            } catch (IllegalAccessException e) {
                if (BuildConfig.DEBUG) {
                    e.printStackTrace();
                }
            }
        }
    }
}