h5頁面喚起app如果沒安裝就跳轉(zhuǎn)下載(iOS和Android)
瀏覽器和app沒有通信協(xié)議,所以h5不知道用戶的手機(jī)釋放安裝了app。因此只能是h5去嘗試喚起app,若不能喚起,引導(dǎo)用戶去下載我們的app。
微信里屏蔽了 schema 協(xié)議,如果在微信中打開h5,則會提示用戶在瀏覽器中打開。<!doctype html>
<html> <head> <title></title> <meta charset="utf-8"> <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no;" name="viewport" /> <script> // 檢查是否安裝app function openApp(e){ var u = window.navigator.userAgent; var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //android終端或者uc瀏覽器 var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); if(isAndroid){ android(); } if(isiOS){ ios(); } } function android(){ var _clickTime = new Date().getTime(); window.location.href = '??????????????????'; /***打開app的協(xié)議,有安卓同事提供***/ //啟動間隔20ms運(yùn)行的定時器,并檢測累計消耗時間是否超過3000ms,超過則結(jié)束 var _count = 0, intHandle; intHandle = setInterval(function(){ _count++; var elsTime = new Date().getTime() - _clickTime; if (_count>=100 || elsTime > 3000 ) { console.log(_count) console.log(elsTime) clearInterval(intHandle); //檢查app是否打開 if ( document.hidden || document.webkitHidden) { // 打開了 window.close(); } else { // 沒打開 alert('沒打開') // window.location.href = "??????????????";//下載鏈接 } } }, 20); } function ios(){ var _clickTime = +(new Date()); var ifr = document.createElement("iframe"); ifr.src = "??????????????"; /***打開app的協(xié)議,有ios同事提供***/ ifr.style.display = "none"; document.body.appendChild(ifr); //啟動間隔20ms運(yùn)行的定時器,并檢測累計消耗時間是否超過3000ms,超過則結(jié)束 var _count = 0, intHandle; intHandle = setInterval(function(){ _count++; var elsTime = +(new Date()) - _clickTime; console.log(_count,elsTime,+(new Date()),_clickTime) if (_count>=100 || elsTime > 3000 ) { clearInterval(intHandle); document.body.removeChild(ifr); //檢查app是否打開 if ( document.hidden || document.webkitHidden) { // 打開了 window.close(); } else { // 沒打開 alert('沒打開') // window.location.href = "???????????????";//下載鏈接 } } },20); } var objbtn=document.getElementById('btn'); objbtn.onclick=function(){ openApp() } </script> </head> <body style="background-color: #fff;" > <!--測試app調(diào)起--> <div id="btn" style="font-size: 40px;background: blue;color: #fff;height: 56px;text-align: center;">btn</div> <!--測試app調(diào)起over--> </body> </html>
重要的是 安裝了app打開app,但是 不能讓用戶在點(diǎn)擊確定的時候,跳轉(zhuǎn)到下載頁。
沒安裝app的用戶,不能等待太久,還不到app下載頁。
若通過url scheme 打開app成功,那么當(dāng)前h5會進(jìn)入后臺,通過計時器會有明顯延遲。利用時間來判斷。
由于安卓手機(jī),頁面進(jìn)入后臺,定時器setTimeout仍會不斷運(yùn)行,所以這里使用setInterval,較小間隔時間重復(fù)多次。來根據(jù)累計時間判斷。
document.hidden對大于4.4webview支持很好,為頁面可見性api。
ios
window.location.href='rtjr://app.rongtuojinrong.com?flag=23&pid={$pid}';
js無法調(diào)起 這種協(xié)議的url
<a href="rtjr://app.rongtuojinrong.com?flag=23&pid={$pid}" ></a>
只能用 a標(biāo)簽,或者 iframe
到此這篇關(guān)于h5頁面喚起app如果沒安裝就跳轉(zhuǎn)下載(iOS和Android)的文章就介紹到這了,更多相關(guān)h5頁面喚起app內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持腳本之家!
標(biāo)簽:棗莊 漯河 青島 池州 西藏 永州 新疆 遼源
巨人網(wǎng)絡(luò)通訊聲明:本文標(biāo)題《h5頁面喚起app如果沒安裝就跳轉(zhuǎn)下載(iOS和Android)》,本文關(guān)鍵詞 頁面,喚起,app,如果,沒,安裝,;如發(fā)現(xiàn)本文內(nèi)容存在版權(quán)問題,煩請?zhí)峁┫嚓P(guān)信息告之我們,我們將及時溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡(luò),涉及言論、版權(quán)與本站無關(guān)。