一般 H5 常見的引導頁歪泳，為已安裝 app 的用戶喚起 app苍狰，未安裝 app 的用戶引導下載 app
一、簡介
1.1 功能
運營常見的功能垮耳，通過短信投放短鏈接颈渊，引導流量。
1.2 基本流程
（1）點擊短鏈接终佛，在默認瀏覽器打開 H5 頁面
（2）頁面初始化時俊嗽，喚起 app
（3）如果用戶未安裝 app，此時有兩種做法铃彰，一種是自動為用戶跳轉(zhuǎn) app 下載地址绍豁，一種是在頁面提供點擊按鈕，引動用戶點擊觸發(fā)下載牙捉。
PS：
自動跳轉(zhuǎn)下載方案：未找到竹揍，可以去懟產(chǎn)品了
提供點擊按鈕方案：天貓、淘寶邪铲、美團外賣
二芬位、實現(xiàn)
首先簡單羅列一下美團、淘寶等引導頁的實現(xiàn)方式带到。
2.1 喚起 app
IOS端
統(tǒng)一使用 location.href 來跳轉(zhuǎn) scheme 協(xié)議地址
Android端
美團
1昧碉、如果是 chrome 瀏覽器，使用 a標簽以及 intent 協(xié)議地址
2、如果是其他情況下被饿，使用 iframe 標簽以及 scheme 協(xié)議地址
天貓?zhí)詫?/strong>
1四康、在 Android 下也使用 location.href
PS：
微信 webview 環(huán)境下，可以直接去下載了锹漱，目前不支持喚起外部 app
2.2 下載 app
自動跳轉(zhuǎn)下載：
由于無法監(jiān)聽是否已安裝 app箭养，也無法監(jiān)聽是否成功喚起 app。
目前的做法是在喚起 app 后的一定時間（一般是3s）哥牍，進行下載跳轉(zhuǎn)毕泌。
按鈕點擊下載：
大家都懂，不廢話了
2.3 下載企業(yè)版 app
某些情況下嗅辣，我們 IOS 被下架了撼泛，這時為了不影響用戶（或者說運營的KPI），需要引導用戶去下載企業(yè)版的 app澡谭。
下載鏈接：itms-services://?action=download-manifest&url= + plist文件地址
用于企業(yè)版 IOS 需要用戶在手機系統(tǒng)設置中添加信任愿题，因此最好有一個單獨的引導安裝教程頁面對用戶進行指導。
PS：
企業(yè)版IOS蛙奖，每個包允許的下載安裝數(shù)量上限為 10000潘酗，因此如果是流量較大的活動，需要客戶端的同學多上傳一些包雁仲。
另外仔夺，線上在運行的企業(yè)版IOS偶爾會被蘋果強制過期，需要更換新的包供用戶下載攒砖。如果需要缸兔，可以找服務端的同學，做一下自動更新包地址的功能吹艇。
三惰蜜、自己的代碼實現(xiàn)以及遇到的一些問題
3.1 代碼實現(xiàn)
模仿淘寶天貓的方式，統(tǒng)一使用 location.href
// 自動喚起 app
handleAutoWakeApp() {
// 微信直接去下載
if (isWx()) {
this.download();
return;
}
let scheme = '';
if (isIos()) { scheme = this.scheme_IOS; }
if (isAndroid()) { scheme = this.scheme_Adr; }
setTimeout(() => {
window.location.href = scheme;
}, 100);
},
3.2 遇到的問題
（1）初始化喚起 app受神，在部分安卓機上會出現(xiàn)沒有喚起彈窗或者喚起彈窗瞬間出現(xiàn)消失的情況抛猖。
原因：暫未找到
解決方案：setTimeout 100 毫米后進行 app 喚起，對用戶體驗的影響也不大鼻听。
（2）跳轉(zhuǎn) appstore 失敗樟结，提示“Safari 瀏覽器打不開該網(wǎng)頁，因為網(wǎng)址無效”
原因：在調(diào)用 location.href = appstore 前使用了 async await 方法調(diào)用接口并耗時 1s以上精算。
解決方案：分離接口
參考文獻瓢宦，H5喚起APP指南(附開源喚端庫)
參考文獻，H5喚醒APP
