Android与JavaScript相互调用(Android和h5交互)

简单的写一个JavaScript和Android原生调用的实现demo，由于方便测试在本地写了一个h5页面(本地页面一般放在assets文件夹下)

第一步：在h5里面写了两个方法：

    callJavaScriptMethod()  javascript调用Android的方法

    androidCallJavaScriptMethod()  Android调用javascript的方法

接下来需要用到WebView，简单介绍下它

WebView介绍

    Android WebView在Android平台上是一个特殊的View， 基于webkit引擎、展现web页面的控件，这个类可以被用来在你的app中仅仅显示一张在线的网页，还可以用来开发浏览器。WebView内部实现是采用渲染引擎来展示view的内容，提供网页前进后退，网页放大，缩小，搜索。Android的Webview在低版本和高版本采用了不同的webkit版本内核，4.4后直接使用了Chrome。现在很多APP都内置了Web网页，比如说很多电商平台，淘宝、京东、聚划算等等。WebView比较灵活，不需要升级客户端，只需要修改网页代码即可。一些经常变化的页面可以用WebView这种方式去加载网页。

    Webview功能强大，可以直接使用html文件（本地sdcard/assets目录），还可以直接加载url，使用JavaScript可以html跟原生APP互调。

第二步：配置WebView基本信息

    1. 设置编码 mwebview.setDefaultTextEncodingName("utf-8");

    2. 设置支持调用JavaScript方法 mwebview.setJavaScriptEnabled(true);

    3. 要处理解析，渲染网页等浏览器做的事情 mwebview.setWebChromeClient(new WebChromeClient());

    4. 添加js接口 mwebview.addJavascriptInterface(MainActivity.this,"mainActivity"); 

        * 有这个才能通信 mainActivity统一标识 js与原生标识要一致,js调用Android

    5. 设置加载路径 mwebview.loadUrl("file:///android_asset/demo.html");

第三步：上面WebView基本信息配置完成，接下来先实现js调用Android实现

    我们需要在Android里面实现javascript写的js调用Android的方法callJavaScriptMethod（）

@JavascriptInterface
public void jsCallNativeLookThread(String msg){
    Toast.makeText(this,msg,Toast.LENGTH_SHORT).show();
}

好了上述就可以实现javascript调用Android的功能了

第四步：Android调用javascript方法，并且返回参数

1. 我在Android view里面定义放置了一个button点击触发调用javascript。对应的触发方法是androidCallHavaScriptMethod(),在h5里面定义的方法

androidCallJSBtn.setOnClickListener(new Button.OnClickListener() {  //给button添加事件响应,执行JavaScript的fillContent()方法
    public void onClick(View v) {
        //callJavaScriptMethod是js里面的方法
        mWebView.loadUrl("javascript:androidCallJavaScriptMethod()");
    }
});

    2 window.androidToast.show("Android 调用js成功");根据方法里面的看到我们需要一个show()方法，我们创建一个类，然后在类里面创建这个方法，最后通过addJavascriptInterface()回调回来就完成了。代码如下

//Android调用js
mWebView.addJavascriptInterface(new Info(){

    @JavascriptInterface
    @Override
    public void show(String info) {
        super.show(info);
        Toast.makeText(MainActivity.this,info,Toast.LENGTH_SHORT).show();
    }
},"androidToast");
androidCallJSBtn = (Button) findViewById(R.id.androidCallJSBtn);
androidCallJSBtn.setOnClickListener(new Button.OnClickListener() {  //给button添加事件响应,执行JavaScript的fillContent()方法
    public void onClick(View v) {
        //callJavaScriptMethod是js里面的方法
        mWebView.loadUrl("javascript:androidCallJavaScriptMethod()");
    }
});

可能阐述不是很清晰，可以点击 下载源码