WebView的简单使用以及 js与java的相互调用

开发App时，经常会遇到要在应用内部加载一个HTML的网页，同时还需要Android页面与Html页面有数据的交互。这就要用到WebView。

1.WebView的使用

webview是谷歌官方提供的基础控件之一。使用方法有两种，其一为静态使用，即在xml布局文件里直接使用。如图：

还有另外一种方法，是在代码里动态创建webview。如图所示：

 web = new WebView(this);
//      设置web的宽高为匹配父元素
        ConstraintLayout.LayoutParams layoutParams = new ConstraintLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);
        web.setLayoutParams(layoutParams);
        rootView.addView(web);
//      设置背景，透明色
        web.setBackgroundColor(0);
//        web.getBackground().setAlpha(0);
//      关闭硬件加速
//      web设置
        WebSettings settings = web.getSettings();
        settings.setJavaScriptEnabled(true);//开启js支持
        settings.setJavaScriptCanOpenWindowsAutomatically(true);//设置允许js弹窗
        settings.setLoadsImagesAutomatically(true); //支持自动加载图片
        settings.setDefaultTextEncodingName("utf-8");//设置编码格式
        settings.setCacheMode(WebSettings.LOAD_NO_CACHE);//设置不开缓存，
        settings.setDomStorageEnabled(true); // 开启 DOM storage API 功能
        settings.setDatabaseEnabled(true);//开启 database storage API 功能
        settings.setAppCacheEnabled(true);//开启 Application Caches 功能
//      设置webview适配显示屏
        settings.setUseWideViewPort(true);//
        settings.setLoadWithOverviewMode(true);
//      适应屏幕，网页将自动缩放
        settings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);

//      加载
        web.loadUrl(UrlUtils.EPG_url);

        web.setWebViewClient(new WebViewClient() {
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                web.loadUrl(url);
                return true;
            }
        });

        //用于监测webview内部的alert等弹出框
        web.setWebChromeClient(new WebChromeClient() {
            @Override
            public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
                return super.onJsAlert(view, url, message, result);
            }
        });

代码中包含创建webview的代码很少，1，创建webview对象，2，通过设置layoutparam来设置webview的位置及大小，3将webview添加进当前的根布局中。

至于其他的代码，是对webview的一些设置，注释写的很清楚。不再做赘述。

当Activity销毁的时候，我们需要手动销毁webview，帮助系统回收webview，并删除缓存，一般在onDestroy()中进行

 if (web != null) {

            web.setWebChromeClient(null);
            web.setWebViewClient(null);
            web.getSettings().setJavaScriptEnabled(false);
            web.clearCache(true);

            web.clearFormData();
            web.clearHistory();
            web.loadDataWithBaseURL(null, "", "text/html", "utf-8", null);
            getCacheDir().delete();
            rootView.removeView(web);
            web.destroy();
            web = null;
        }

2 java调用webview中的js代码

既然我们已经加载了一个网页进来，那要如何和他进行交互呢？

java调用js代码很简单

web.loadUrl("javascript:androidAuth('sss')");

这是固定写法，androidAuth是js中写好的一个方法，接受一个string参数，这里我们传递了一个"sss"字符串过去。

3.js调用java代码

那如果网页想调用我们Android原生的方法，需要如何做呢？

比第2步要稍微复杂一点：

1，先定义一个实体类，类中写着需要让js调用的方法，注意：需要在方法上加上注解@JavascriptInterface

//js调用java接口
    private class JSinterface {

        @JavascriptInterface
        public void goIndex() {
//          需要弹出挽留页
            LogUtil.LogI("首页返回：goIndex");
          
        }
}

2.将写好的类对象抛给js，这里的第二个参数是让js用的对象名称，可以自定义。

web.addJavascriptInterface(new JSinterface(), "jsObj");

js代码中需要写好jsbridge，这是前端的工作，不需要我们操心。

3.当js调用java代码时，只需要用我们传递过去的对象名称可以直接点出来方法，如：jsObj.goIndex()

当然，如果需要传递参数，可以直接在（）中传递过去。

最后，当使用webview时，需要给予网络权限：

<uses-permission android:name="android.permission.INTERNET" />

webview的基础使用就是这些了。

以上。

如有错误，请指出来，大家一起成长。