与安卓联调,调用安卓那边的方法,获取到安卓传过来的数据,再携带这些数据发送axios请求,获取到用户的信息

第一步:js调用Android方法:接收Android传递过来的数据,并做处理

//参数一:调用java中的方法   submitFromWeb是方法名,必须和Android中注册时候的方法名称保持一致

//参数二:返回给Android端的数据,可以为字符串,json等信息

//参数三:js接收到Android传递过来的数据之后的相应处理逻辑

            window.WebViewJavascriptBridge.callHandler(

               'getUserAuth'

               , {'param': ""}

               , function(responseData) {

                    alert(responseData)

               }

           );

第二步:JS注册事件监听

       function connectWebViewJavascriptBridge(callback) {

           if (window.WebViewJavascriptBridge) {

               callback(WebViewJavascriptBridge)

           } else {

               document.addEventListener(

                   'WebViewJavascriptBridgeReady'

                   , function() {

                       callback(WebViewJavascriptBridge)

                   },

                   false

               );

           }

       }

第三步:注册回调函数,第一次连接时调用 初始化函数

       connectWebViewJavascriptBridge(function(bridge) {

            //初始化

           bridge.init();

           //Android调用js方法:functionInJs方法名称需要保持一致 ,并返回给Android通知

           bridge.registerHandler("functionInJs", function(data, responseCallback) {

               alert(data);

               var data2 = document.getElementById("text1").value;

               var responseData = "我是Android调用js方法返回的数据---"+ data2;

               responseCallback(responseData);

           });

       })

问题:刚进入页面就使用WebViewJavascriptBridge调用Android的方法不起作用,若设置1秒的定时器就可以调用到这个方法,说明刚进入页面时WebViewJavascriptBridge可能还未初始化完成

解决:把第一步的代码放在第三步中bridge.init();的后面执行,就可以达到刚进入页面就调用成功,获取到安卓的数据,并携带数据发送axios请求获取到用户数据,渲染到页面

posted @ 2021-05-11 15:04  chicidol  阅读(310)  评论(0编辑  收藏  举报