how to hook android app function use html with javascript

为什么要这么做

在使用html开发手机端的时候我们就会常请求app来拿到手机内的数据，这时候我们就会用到接下来我要讲到的内容

怎么做

一开始我也一头雾水，没做过。 但是不要怕，跟着哥哥走，你会发现原来这很简单

这么做

我们的需求暂定如下

我们要加载一个html，在这个html里写一段javascript检查手机是否已经开启网络连接，如果没有开启网络连接我们给出提示，如果网络连接没有开启不能加载webview默认的错误页面（那样太不专业了）

So 跟着哥哥的脚步，一步一步来

先看这个类（其实这个就是我们准备在javascript中调用的类）

// call from html
private final class JsResload {

    @SuppressWarnings("unused")
    public void reload() {
        reloadWebView();
    }
}

reloadWevView文件实体如下

private void reloadWebView() {
    if (hasNetwork()) {
        mWebView.loadUrl(BluelionReading.BASE_API_URL + BookMethods.BOOK_STORE, getHeadersMap());
    } else {
        Toast.makeText(this, getString(R.string.network_notgelivable_refresh), Toast.LENGTH_SHORT).show();
        mWebView.loadUrl(DEFAULT_PAGE);
    }
}

其中的常量值如下：

public static final String  BOOK_STORE          = "/bookstore";
private static final String     DEFAULT_PAGE    = "file:///android_asset/about/wrong.html";

关键还是在这里，如何使用javascript调用这个java类呢？ 接下来就是我们见证奇迹的时刻

JsResload jsResload = new JsResload();
mWebView.addJavascriptInterface(jsResload, "BluelionJSFrame");

我们通过webView的方法mWebView.addJavascriptInterface 把这个java类设给了webview,然后我们在javascript中调用这个方法如下:

function reloadPath() {
    BluelionJSFrame.reload();
}

当我们调用javascript的reloadPath这个方法就会请求webView, 当webview拦截到这个方法时就会调用我们写好的java类来处理。So easy! 是不是很简单啊。将来你们要使用html请求Android的数据 ，就应该知道如何使用了吧！

例如我们想写一个javascript方法从App中读取一个json格式的电话列表。这时候你就知道怎么去实现啦。 

结论

Android在一开始 设计WebView时就把将来使用html做App应该的功能给设计进去了。 所以我们在现在有一个javascript和app沟通的桥，通过javascript与webview这个桥就可以访问手机上的数据了，还可以调用手机上的程序。