• webview与JavaScript之间的交互


    据说WebView的强大之处就是能和JavaScript进行交互调用。

    参考博客:http://droidyue.com/blog/2014/09/20/interaction-between-java-and-javascript-in-android/

    java调用JavaScript

    1. 实例化webview,获得WebSettings。通过WebSettings设置可以和JavaScript交互。
              myWebView = (WebView) findViewById(R.id.webview);
              WebSettings webSettings = myWebView.getSettings();
              // 使能使用JavaScript
              webSettings.setJavaScriptEnabled(true);
    2. 设置webview的 WebViewClient,重写onPageFinished方法。设置当网页加载完后去调用网页中JavaScript。
              myWebView.setWebViewClient(new WebViewClient() {
      
                  @Override
                  public void onPageFinished(WebView view, String url) {
                      //当page也加载完后
                      super.onPageFinished(view, url);
                      javaUseJavaScript(myWebView);
                  }
      
              });
              myWebView.loadUrl("file:///android_asset/js_java_interaction.html");
    3. 实现第二步里自定义的javaUseJavaScript方法。
          /**
           * java调用js方法
           * 
           * @param webView
           */
          private void javaUseJavaScript(WebView webView) {
              String call = "javascript:sayHello()";
      
              // call = "javascript:alertMessage("" + "content" + "")";
              //
              // call = "javascript:toastMessage("" + "content" + "")";
              //
              // call = "javascript:sumToJava(1,2)";
              webView.loadUrl(call);
          }

       完成了上面的步骤,就能调用JavaScript中sayHello()方法。sayHello方法在哪呢??就在你myWebView.loadUrl("file:///android_asset/js_java_interaction.html");的html文件中

      <html>
      <script type="text/javascript">
          function sayHello() {
              alert("Hello")
          }
      
          function alertMessage(message) {
              alert(message)
          }
      
          function toastMessage(message) {
              window.control.toastMessage(message)
          }
      
          function sumToJava(number1, number2){
             window.control.onSumResult(number1 + number2)
          }
      </script>
      Java-Javascript Interaction In Android
      </html>
    4. 总结:的从上面的代码可以看出,java调js的代码中,java可以给js传递参数,但无法获得返回值。如果必须要返回值,只能反过来通过js调用java。也就是我们下面说的:

    JavaScript调用Java

    1. 编写JavaScript代码去调用java中的方法。其实在java调用JavaScript的第三步的html中我们已经调用了。(绿色部分)
    2. 在java中编写代码,响应JavaScript的调用。

                      2.1给webview添加JavaScript接口类

    myWebView.addJavascriptInterface(new JsInteration(), "control");

                      2.2编写JavaScript的接口类  JsInteration

      /**
         * 实现js调用java的具体代码
         * @author cyq
         *
         */
        public class JsInteration {
            
    
            @JavascriptInterface
            public void toastMessage(String message) {
                Toast.makeText(getApplicationContext(), message, Toast.LENGTH_LONG).show();
            }
            
            @JavascriptInterface
            public void onSumResult(int result) {
                Log.i(TAG, "onSumResult result=" + result);
            }
        }
    • 总结:js调用java代码就是window.在addJavascriptInterface设置的第二个字符参数.在addJavascriptInterface这第一个参数类里的方法.(参数1,参数2.....).
    • 注意:

                    1要调用WebView的addJavascriptInterface方法。在JavaScript的接口类中的方法前要加上@JavascriptInterface注解。

                    2html文件要放到Android项目的assets文件夹下:

                                    

                    3 调用JavaScript要在加载完网页之后,就是WebViewClient的onPageFinished方法中。

                    4 WebView的方法必须在主线程之中,至于为何就不知道了。原本我担心加载网页放在主线程中会导致ANR,其实不用担心这个问题,WebView内部应该做了处理了。

    代码在WebViewActivity中。

    4.4处理

    前面说到java调用JavaScript只能传参数,无法得到返回值。如果需要返回值需要反过来JavaScript调用java代码,通过参数传递获得返回值。这在4.4以后有了改进。可以通过下面说的调用JavaScript的方法获得返回值。不过我个人认为还是用传递参数的方法比较好吧。版本兼容嘛。

    1. 在WebViewClient的onPageFinished方法中调用JavaScript
              myWebView.setWebViewClient(new WebViewClient() {
      
                  @Override
                  public void onPageFinished(WebView view, String url) {
                      //当page也加载完后
                      super.onPageFinished(view, url);
                      testEvaluateJavascript( myWebView);
                  }
      
              });
    2. 实现java代码
      /**
       * 调用JavaScript方法获得返回值
       * @param myWebView2
       */
          @SuppressLint("NewApi")
          protected void testEvaluateJavascript(WebView myWebView2) {
              myWebView.evaluateJavascript("getReturn(""+"参数1"+"")", new ValueCallback<String>() {
                  
                  @Override
                  public void onReceiveValue(String value) {
                      Log.i(TAG, "onReceiveValue value=" + value);
                  }
              });
          }
    3. 在html中编写JavaScript代码(绿色部分)
      <html>
      <script type="text/javascript">
          function sayHello() {
              alert("Hello")
          }
      
          function alertMessage(message) {
              alert(message)
          }
      
          function toastMessage(message) {
              window.control.toastMessage(message)
          }
      
          function sumToJava(number1, number2){
             window.control.onSumResult(number1 + number2)
          }
          function getReturn(message) {
              return 1;
          }
      </script>
      Java-Javascript Interaction In Android
      </html>

       运行代码,在Android的log中能够看到返回值1.

        

  • 相关阅读:
    随性
    PHP csv文件处理时中文转码
    content...
    macro
    docker Alpine 编译安装node.js的dockerfile文件
    docker hub登录不上一直卡的原因
    java接口与模式(观察者)
    java模式的一点感受
    编码原则之接口隔离
    如何获取web应用的部署路径(多种方式)
  • 原文地址:https://www.cnblogs.com/bigthing33/p/5166924.html
Copyright © 2020-2023  润新知