小編給大家分享一下Html5如何實(shí)現(xiàn)喚醒百度、高德APP，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

創(chuàng)新互聯(lián)長(zhǎng)期為上千多家客戶(hù)提供的網(wǎng)站建設(shè)服務(wù)，團(tuán)隊(duì)從業(yè)經(jīng)驗(yàn)10年，關(guān)注不同地域、不同群體，并針對(duì)不同對(duì)象提供差異化的產(chǎn)品和服務(wù)；打造開(kāi)放共贏平臺(tái)，與合作伙伴共同營(yíng)造健康的互聯(lián)網(wǎng)生態(tài)環(huán)境。為嘉陵企業(yè)提供專(zhuān)業(yè)的成都網(wǎng)站建設(shè)、網(wǎng)站制作，嘉陵網(wǎng)站改版等技術(shù)服務(wù)。擁有十多年豐富建站經(jīng)驗(yàn)和眾多成功案例,為您定制開(kāi)發(fā)。

具體思路就是點(diǎn)擊選擇地圖的時(shí)候，先去請(qǐng)求APP鏈接，800毫秒后無(wú)響應(yīng)，再跳轉(zhuǎn)至H5鏈接。這樣的做法有一點(diǎn)不好就是不管跳不跳APP，都會(huì)跳到H5的鏈接。有好的想法可以評(píng)論一下。

下面放相關(guān)代碼：

 function  ToggleAppAndH5( AppUrl , AppCallback = () => {}){
             // 先走APP
            const ifr = document.createElement('iframe');
                ifr.src = AppUrl;
                ifr.style.display = 'none';
                document.body.appendChild(ifr);
                setTimeout(function(){
                    document.body.removeChild(ifr);
                }, 3000);
            
                  // 800毫秒后調(diào)用H5鏈接
                let timer = setTimeout(function () {
                        clearTimeout(timer);
                        AppCallback();
                }, 800);
        
                window.onblur = function () {
                    clearInterval(timer);
                };
         }

        function Callback(){
           // 這里放相關(guān)H5鏈接
           if (mapType === 'baidu') {
              frameDom.attr('src', "/tupian/20230522/direction
           } else if (mapType === 'amap') {
              frameDom.attr('src', "/tupian/20230522/dir
           }
         }

         const u = navigator.userAgent;
         const isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios終端

1. 高德

   // 蘋(píng)果和安卓頭部不一樣
   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+"&src=xxx";

   ToggleAppAndH5(AppUrl,Callback)

2.百度

   // 蘋(píng)果和安卓頭部不一樣
   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&src=com.youbei.chefu";
   
   ToggleAppAndH5(AppUrl, Callback)

以上是“Html5如何實(shí)現(xiàn)喚醒百度、高德APP”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

名稱(chēng)欄目：Html5如何實(shí)現(xiàn)喚醒百度、高德APP-創(chuàng)新互聯(lián)
文章網(wǎng)址：http://weahome.cn/article/dcoipo.html