当前位置: 移动技术网 > IT编程>移动开发>Android > Android中webview与JS交互、互调方法实例详解

Android中webview与JS交互、互调方法实例详解

2019年07月24日  | 移动技术网IT编程  | 我要评论

飞车车队名字大全,皇家客,化工综合服务商

android中webview与js交互、互调方法实例详解

前言:

对于试水的功能,一般公司都会采用h5的方式来开发,可以用很少的资源与很短的项目工期来完成。
但许多情况下,h5页面会需要一些原生持有的一些如用户信息之类的数据,一些交互也需要调用原生的,如toast之类要保持同一个手机风格一致的交互行为。这个时候就需要能够让js主动调用原生的方法来进行操作或者获取数据。或者是原生调用js的方法在h5加载的时候传递一些参数。

对于原生调用js的方法

我们需要实现一个webviewclient,在这个webviewclient里面进行js方法加载的替换

 webview_.setwebviewclient(new webviewclient() {
      public void onpagefinished(webview view, string url) {
        view.loadurl(messageformat.format("javascript:initevaluationpage({0})",
            util.wrapgetparameter(json)
        ));
      }
    });

这里的initevaluationpage必须要和js的方法名一致

建议传递json格式数据作为参数。

不要忘了允许webview执行js代码

webview_.getsettings()s.setjavascriptenabled(true);

对于js调用原生方法,稍微复杂一些

首先,需要本地定义一个接口,接口名需要和js内写的一致

比如js需要客户端保存的用户信息

js中代码是这样的

  var userinfo = json.parse(window.jsuserinfointerface.getuserinfo());

那么我们本地也需要定义一个对应的接口

public interface jsuserinfointerface {

  @javascriptinterface
  string getuserinfo();

}

接口名方法名一致

实例化这个接口,在实例方法内返回我们的用户信息

 jsuserinfointerface method3 = new jsuserinfointerface() {

      @override
      @javascriptinterface
      public string getuserinfo() {
        sharedpreferences sharedpreferences = getactivity().getapplicationcontext().getsharedpreferences(
            "share", context.mode_private);
        string tel = sharedpreferences.getstring(constant.key_username, "");
        string userid = sharedpreferences.getstring("userid", "");
        return "{\"user_id\":\"" + userid + "\",\"user_tel\":\"" + tel + "\"}";
      }

    };

注意不能忘了 @javascriptinterface注解

然后将这个接口方法加入到webview_中,注意第二个参数就是接口名,需要和js中的一致。

webview_.addjavascriptinterface(method3, "jsuserinfointerface");

这样就可以在js调用window.jsuserinfointerface.getuserinfo()的时候返回我们实例里面给的数据

同样的,我们也可以不返回数据直接执行。比如弹一个原生的dialog。

需要注意的是js里面是没有主线程子线程的概念的,当js进行网络请求的时候,webview会默认给他开子线程。具体机制大家感兴趣可以去了解。不过这也就意味着你不能直接在给js掉的原生方法中进行ui操作。你可以选择发送给主线程执行。

比如下面的代码我是用rxjava来切换线程的

 jsdialoginterface method2 = new jsdialoginterface() {

      @override
      @javascriptinterface
      public void changedialog(string arg0) {
        observable.just(arg0)
            .observeon(androidschedulers.mainthread())
            .subscribe(mess -> {
              if (mess.equals("show")) {
                ld_.show();
              } else {
                ld_.dismiss();
              }
            });
      }
    };

最后

一点小建议

如果你的项目中有很多或者一定数量的js交互,建议写一个有返回值的接口。然后通过json参数来进行控制。内部制定一个解析协议,根据json的数据来决定要做什么事,避免大量定义接口 ,也避免构建太多的实例消耗资源

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复

相关文章:

验证码:
移动技术网