Android JS交互方式

发表于 更新于 分类于
  • 1.通过schema方式，使用shouldOverrideUrlLoading方法对url协议进行解析。这种js的调用方式与ios的一样，使用iframe来调用native代码。
  • 2.通过在webview页面里直接注入原生js代码方式，使用addJavascriptInterface方法来实现。
    在android里实现如下：
1
2
3
4
5
6
7
class JSInterface {
    @JavascriptInterface //注意这个代码一定要加上
    public String getUserData() {
        return "UserData";
    }
}
webView.addJavascriptInterface(new JSInterface(), "AndroidJS");

上面的代码就是在页面的window对象里注入了AndroidJS对象。在js里可以直接调用

1
alert(AndroidJS.getUserData()) //UserDate

要注意的是在Android API17之后，JsInterface实现类需要添加注解@JavascriptInterface，否则会失效；

  • 3.使用prompt,console.log,alert方式，这三个方法对js里是属性原生的，在android webview这一层是可以重写这三个方法的。一般我们使用prompt，因为这个在js里使用的不多，用来和native通讯副作用比较少。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
class YouzanWebChromeClient extends WebChromeClient {
    @Override
    public boolean onJsPrompt(WebView view, String url, String message, String defaultValue, JsPromptResult result) {
        // 这里就可以对js的prompt进行处理，通过result返回结果
    }
    @Override
    public boolean onConsoleMessage(ConsoleMessage consoleMessage) {

    }
    @Override
    public boolean onJsAlert(WebView view, String url, String message, JsResult result) {

    }
}

Native调用javascript方式
在android里是使用webview的loadUrl进行调用的，如：

1
2
// 调用js中的JSBridge.trigger方法
webView.loadUrl("javascript:JSBridge.trigger('webviewReady')");