Android原生与H5通信

如今，混合开发似乎成为了主流。H5拥有跨平台的优势，却存在性能上的问题正好可以用搭建原生壳承载H5代码的方式去解决。

成都网站设计、成都网站建设的关注点不是能为您做些什么网站，而是怎么做网站，有没有做好网站，给创新互联一个展示的机会来证明自己，这并不会花费您太多时间，或许会给您带来新的灵感和惊喜。面向用户友好，注重用户体验，一切以用户为中心。

如何理解这种方式，就好像说Android原生代码封装外壳，内部包含H5代码作为核心内容。更细节一点，我们把引导页、登录页、首页等等与业务关联打不并且与用户交互较多的页面用原生去写，而业务页面，逻辑代码由H5处理，将他们结合就形成了混合开发的由原生壳承载的H5app。

这么做有什么好处呢?组个例子，我们利用这种方式做好了一个Android原生APP，现在需要做一个IOS原生APP，我们可以直接简单搭建一个IOS壳，复用H5代码，完成IOS原生APP。同时我们需要在钉钉、微信小程序等等平台搭建，可以直接复用我们已有的H5代码。

而这样的搭建方式比纯H5搭建的APP的优势在于因为有原生壳的存在，可以自由的使用原生API。保证了交互上的流畅性。

如何实现原生与H5的通信呢?

关于通讯我们需要解决两个问题：

原生向H5通讯
H5向原生通讯

第一个问题很好解决，以Android为例，WebView提供特有的方法，当你打开一个Html，你可以去调用这个Html中包含的JS。例如：

 
 
 
  
  
  webview.loadUrl("javascript:callH5('Android ok')");

第二个问题我们采用发送指令的方式来处理。同样以Android为例，WebView可以拦截html跳转时的url地址，我们可以利用这个地址，约定一个规则，如果符合规则，则拦截后不执行跳转，通过这个url获取我们需要的信息，执行对应的操作。

 
 
 
  
  
  window.location.href=protocol://android?code=toast&data=+Json.stringify(config)

上述是一段JS的页面跳转方法。我们规定规则PRE=protocol://android?，当我们拦截的url包含PRE时，则我们认为这是一条指令，不需要跳转页面，应该执行对应操作。而参数code则是我们的指令内容，data为通信时的传参。

接下来是原生这边处理。首先我们拦截url。这里笔者还处理由于Http攻击导致H5页面出现广告的问题。我们主要是第一个if。

 
 
 
  
  
  webView.setWebViewClient(new WebViewClient() {  
  
  
  // Load opened URL in the application instead of standard browser  
  
  
  // application  
  
  
  public boolean shouldOverrideUrlLoading(WebView view, String url) {  
  
  
  showLogInfo("拦截到的url----"+url);  
  
  
  String advertising="http://"+sharedPreferencesUtil.getData(Constant.IP, RequestConfig.IP)  
  
  
  +":"+sharedPreferencesUtil.getData(Constant.PORT,RequestConfig.IPPORT);  
  
  
  if (url.contains(pre)) {  
  
  
  Map map = getParamsMap(url, pre);  
  
  
  String code = map.get("code");  
  
  
  String data = map.get("data");  
  
  
  parseCode(code, data);  
  
  
  return true;  
  
  
  }else if(!url.contains(advertising)){  
  
  
  showLogError("拦截到植入广告，广告的url——"+url);  
  
  
  return true;  
  
  
  } else{  
  
  
  return false;  
  
  
  }  
  
  
  }  
  
  
  });

return 为ture表示拦截成功，不执行后面的跳转操作。而false表示按正常流程执行。拦截成功后我们从url中获取code和data，接着就可以按照我们自己的需求去处理了。

网站题目：Android原生与H5通信
本文网址：http://www.shufengxianlan.com/qtweb/news35/39735.html

网站建设、网络推广公司-创新互联，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有等

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容