Android中WebView与JavaScript相互调用

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/true100/article/details/84884592

 WebView是我们在安卓开发中的常用控件，它可以实现在Android手机中访问网页内容。Android项目中的一些诸如用户须知，注册协议等相关信息一般都用WebView加载对应的网页实现。
  有时候我们需要在Android端的WebView中调用js中的方法，或者在js中调用Android中的java方法。网上有很多相关的介绍及资料。但是有的资料在实际应用中没有达到想要的效果，所以记录下我在实现功能中用到的方法。我用的是安卓7.1系统手机。
  Android端Activity中代码：

public class WebViewTestActivity extends Activity {
    private static final String TAG = WebViewTestActivity.class.getSimpleName();
    private WebView testWebView;
    private static final String HTTP_URL = "";

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test_wv);
        initWidget();
    }


    protected void initWidget() {
        testWebView = (WebView) findViewById(R.id.test_webview);
        WebSettings webSettings = testWebView.getSettings();
        webSettings.setDomStorageEnabled(true);
        //下面会对webSettings的参数根据实际情况设置
        //支持缩放，默认为true。
        webSettings.setSupportZoom(true);
        //调整图片至适合webview的大小
        webSettings.setUseWideViewPort(true);
        // 缩放至屏幕的大小
        webSettings.setLoadWithOverviewMode(true);
        //设置默认编码
        webSettings.setDefaultTextEncodingName("utf-8");
        ////设置自动加载图片
        webSettings.setLoadsImagesAutomatically(true);

        //多窗口
        webSettings.supportMultipleWindows();
        //获取触摸焦点
        testWebView.requestFocusFromTouch();
        //允许访问文件
        webSettings.setAllowFileAccess(true);
        //开启javascript
        webSettings.setJavaScriptEnabled(true);
        //支持通过JS打开新窗口
        webSettings.setJavaScriptCanOpenWindowsAutomatically(true);
        //提高渲染的优先级
        webSettings.setRenderPriority(WebSettings.RenderPriority.HIGH);
        //支持内容重新布局 // 适应屏幕，内容自动缩放
       webSettings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);
        //关闭webview中缓存
        webSettings.setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);
        testWebView.clearCache(true);
        //加载要显示的网页，可以是assets下的本地html文件格式"file:///android_asset/xx.html"，也可以是服务器端的html网页
         testWebView.loadUrl(HTTP_URL);
//----------------------------------------------------------------------------------------------------
        //实现在Android端调用Javascript中的方法
        testWebView.evaluateJavascript("javascript:JSMethod()", new ValueCallback<String>() {
            @Override
            public void onReceiveValue(String value) {
                LogUtil.e(TAG, "收到JS的内容：" + value);
            }
        });
//----------------------------------------------------------------------------------------------------
        //提供方法给Javascript调用
        testWebView.addJavascriptInterface(new Android4JsInterface(), "webTest");
    }

    public class Android4JsInterface {
        @JavascriptInterface
        public void showById(String gwId) {   //提供给js调用的方法
            Toast.makeText(getApplicationContext(), gwId, Toast.LENGTH_LONG).show();
            LogUtil.e(TAG, "被JS调用了，传入了参数是：" + gwId);
        }
    }


    @Override
    protected void onResume() {
        super.onResume();
    }

    @Override
    protected void onPause() {
        super.onPause();
    }

    @Override
    protected void onDestroy() {
        super.onDestroy();

    }

}

Javascript端代码：

//这个方法是供Android端调用 
	function JSMethod(){
	//在js中处理业务
	}
	
//这个方法就是实现调用 了Android端的contact2Android方法
	function contact2Android(){
	//这里的webTest就是Android端中addJavascriptInterface(new Android4JsInterface(), "webTest");与第二个参数相一致
	     window.webTest.showById("148");
	     }

这样就可以实现Android端与JS端相互调用