JS与原生APP进行交互

应用场景：APP详情页采用H5页面制作，但页面中拥有与原生APP交互的点击事件，如：分享功能；

由于电商项目的商品详情页比较复杂，所以采用了H5页面进行制作，但是H5页面中拥有分享按钮，需要通过APP的方法分享出去；

具体实现方法：

1.H5页面中分享的方法id=share;

$("#share").click(function(){

//首先判断系统是ios还是android

        var url= window.location.href;//获取url 
        var u = navigator.userAgent;
        var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
        var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端

//写需要给后台传送的数据   

var data = {'name':name,'url':url,'img':img,'event':event} //模拟数据

     if(isAndroid){
                android.share(data);
           }else if(isiOS){
                window.webkit.messageHandlers.AppModel.postMessage(data);
         }

})

备注：

  1.数据中的event是一个点击事件，由于我个人所在的项目中的IOS工程师需要这个事件，所以也获取出来增加到了数据中；

  2. android.share（data）  share是提前与安卓工程师定好的；

  3. window.webkit.messageHandlers.AppModel.postMessage 是给IOS端发送数据的，这个需要与IOS人员沟通，看看采用哪种方式进行交
互，我所在的项目采用的是这种的；具体可参考：https://www.jianshu.com/p/433e59c5a9eb  （OC与JS交互）；

 4. 成功后在web端是无法看到效果的，点击后会报错，需要在安卓APP内与IOSAPP内进行查看；