Html5如何实现唤醒百度、高德APP
短信预约 -IT技能 免费直播动态提醒
小编给大家分享一下Html5如何实现唤醒百度、高德APP,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!
具体思路就是点击选择地图的时候,先去请求APP链接,800毫秒后无响应,再跳转至H5链接。这样的做法有一点不好就是不管跳不跳APP,都会跳到H5的链接。有好的想法可以评论一下。
下面放相关代码:
function ToggleAppAndH5( AppUrl , AppCallback = () => {}){ // 先走APP const ifr = document.createElement('iframe'); ifr.class="lazy" data-src = AppUrl; ifr.style.display = 'none'; document.body.appendChild(ifr); setTimeout(function(){ document.body.removeChild(ifr); }, 3000); // 800毫秒后调用H5链接 let timer = setTimeout(function () { clearTimeout(timer); AppCallback(); }, 800); window.onblur = function () { clearInterval(timer); }; } function Callback(){ // 这里放相关H5链接 if (mapType === 'baidu') { frameDom.attr('class="lazy" data-src', "http://api.map.baidu.com/direction?origin=latlng:"+ curLat +","+ curLng +"|name:"+ currAddr +"&destination=latlng:"+ elat +","+ elng +"|name:"+ eaddr +"®ion="+ cityName +"&mode=driving&output=html&class="lazy" data-src=com.youbei.chefu"); } else if (mapType === 'amap') { frameDom.attr('class="lazy" data-src', "https://ditu.amap.com/dir?type=car&from[lnglat]="+ curLng +","+ curLat +"&from[name]="+currAddr+"&to[lnglat]="+ elng +","+ elat +"&to[name]="+eaddr+"&class="lazy" data-src=com.youbei.chefu"); } } const u = navigator.userAgent; const isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
高德
// 苹果和安卓头部不一样 let proto = isiOS ? 'iosamap://path' : 'amapuri://route/plan' ; const AppUrl = proto + "?t= 0&slat="+curLat+"&slon="+curLng+"&sname="+currAddr+"&dlat="+elat+"&dlon="+elng+"&dname="+eaddr+"&class="lazy" data-src=xxx"; ToggleAppAndH5(AppUrl,Callback)
百度
// 苹果和安卓头部不一样 let proto = isiOS ? 'baidumap://' : 'bdapp://' const AppUrl = proto + "map/direction?region="+cityName+"&origin=latlng:"+ curLat+","+ curLng +"|name:"+ currAddr +"&destination=latlng:"+ elat +","+ elng +"|name:"+ eaddr +"&coord_type=bd09ll&mode=driving&class="lazy" data-src=com.youbei.chefu"; ToggleAppAndH5(AppUrl, Callback)
以上是“Html5如何实现唤醒百度、高德APP”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注编程网行业资讯频道!
免责声明:
① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。
② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341