開發(fā)APP下載引導頁面哼，情況說明：
1.APP下載鏈接由后臺返回
2.iOS版本打開到AppStore下載
3.安卓版本鏈接有可能是安裝包apk,也有可能是應用寶下載地址
4.考慮環(huán)境因素：安卓端、iOS端、PC端滚秩、微信瀏覽器
一、界面
安卓端只顯示安卓版本的下載按鈕畸肆，iOS端只顯示iOS版本的下載按鈕佑惠，PC端上兩個按鈕都顯示。
UI界面
二萍虽、流程圖
把我的思路畫成流程圖：
App下載引導頁流程圖
三睛廊、關鍵代碼
判斷H5當前運行環(huán)境，是Android還是iOS杉编？是否在微信里面超全？安卓下載的鏈接是來自應用寶還是安裝包apk咆霜？
let u = navigator.userAgent
// 是否是Android終端
this.isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1 // Android終端
// 是否是ios終端
this.isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)
// 是否在微信里面
if (u.toLowerCase().match(/MicroMessenger/i) == 'micromessenger') {
this.isInWechat = true
}
if (this.isAndroid && this.isInWechat) {
// 是否是應用寶鏈接
if (this.android_url.startsWith('https://android.myapp.com')) {
// 是應用寶鏈接,可以直接下載，不需彈出提示在瀏覽器打開
this.needShowMask = false
} else {
this.needShowMask = true
}
}
