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

 更新时间:2017年03月27日 14:39:42   投稿:lqh  
这篇文章主要介绍了Android中webview与JS交互、互调方法实例详解的相关资料,需要的朋友可以参考下

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的数据来决定要做什么事,避免大量定义接口 ,也避免构建太多的实例消耗资源

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

相关文章

  • Android实现获取未接来电和未读短信数量的方法

    Android实现获取未接来电和未读短信数量的方法

    这篇文章主要介绍了Android实现获取未接来电和未读短信数量的方法,是Android程序开发中非常常见的重要功能,需要的朋友可以参考下
    2014-08-08
  • Android Studio error: Unable to start the daemon process的解决方法

    Android Studio error: Unable to start the daemon process的解决方

    这篇文章主要介绍了在 Android Studio 上新建项目,出现 Unable to start the daemon process问题的几种的解决方法,需要的朋友可以参考下
    2020-10-10
  • Android开发双向滑动选择器范围SeekBar实现

    Android开发双向滑动选择器范围SeekBar实现

    这篇文章主要为大家介绍了Android开发双向滑动范围选择器SeekBar实现,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-06-06
  • Android中卡顿优化布局详细介绍

    Android中卡顿优化布局详细介绍

    大家好,本篇文章主要讲的是Android中卡顿优化布局详细介绍,感兴趣的同学赶快来看一看吧,对你有帮助的话记得收藏一下
    2022-01-01
  • Android编程设计模式之工厂方法模式实例详解

    Android编程设计模式之工厂方法模式实例详解

    这篇文章主要介绍了Android编程设计模式之工厂方法模式,结合实例形式详细分析了Android工厂方法模式的概念、原理、使用方法及相关注意事项,需要的朋友可以参考下
    2017-12-12
  • 如何通过Battery Historian分析Android APP耗电情况

    如何通过Battery Historian分析Android APP耗电情况

    Android 从两个层面统计电量的消耗,分别为软件排行榜及硬件排行榜。它们各有自己的耗电榜单,软件排行榜为机器中每个 App 的耗电榜单,硬件排行榜则为各个硬件的耗电榜单。这两个排行榜的统计是互为独立,互不干扰的
    2021-06-06
  • Flutter Drawer抽屉菜单示例详解

    Flutter Drawer抽屉菜单示例详解

    这篇文章主要为大家详细介绍了Flutter Drawer抽屉菜单示例,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-03-03
  • Android编写简单的聊天室应用

    Android编写简单的聊天室应用

    这篇文章主要为大家详细介绍了Android实现简单聊天室的相关资料,具有发送表情,更改头像等功能
    2016-06-06
  • Android中音视频合成的几种方案详析

    Android中音视频合成的几种方案详析

    随着音视频领域的火热,在很多领域(教育,游戏,娱乐,体育,跑步,餐饮,音乐等)尝试做音视频功能,下面这篇文章主要给大家介绍了关于Android中音视频合成的几种方案的相关资料,需要的朋友可以参考借鉴,下面随着小编来一起看看吧。
    2017-12-12
  • Android开发中MotionEvent坐标获取方法分析

    Android开发中MotionEvent坐标获取方法分析

    这篇文章主要介绍了Android开发中MotionEvent坐标获取方法,结合实例形式分析了MotionEvent获取坐标的相关函数使用方法与相关注意事项,需要的朋友可以参考下
    2016-02-02

最新评论