摘要：調(diào)起的注意事項(xiàng)年初，微信下全面封禁了，所以在微信下是調(diào)不起的，暫時(shí)是沒(méi)有什么辦法。所以安卓下調(diào)不起是一件十分正常的事情。表示的包名，比如，表示調(diào)起的安卓下判斷是否調(diào)起成功其實(shí)有一種方法可以判斷安卓下是否調(diào)起成功。

在H5頁(yè)面或者app的webview中調(diào)起第三方app

調(diào)起app是操作系統(tǒng)(iOS、Android)的機(jī)制，在h5頁(yè)面，我們可以做的不多。

在調(diào)起之前，h5頁(yè)面無(wú)法判斷當(dāng)前手機(jī)是否安裝了對(duì)應(yīng)的app，我們只能去嘗試調(diào)起，并且用一些方法來(lái)處理沒(méi)有調(diào)起的情況。

調(diào)起的原理就不介紹了，網(wǎng)上一搜一大堆。直接上核心代碼。

if(iOS9) {
    window.location.href = ${universalLink};
}
else {
    var ifr = document.createElement("iframe");
    ifr.src = ${scheme};
    ifr.style.display = "none";
    document.body.appendChild(ifr);
    window.setTimeout(function () {
       document.body.removeChild(ifr);
    }, 300);
}

舉個(gè)栗子：
${universalLink} = "http://myapp.com"
${scheme} = "myapp://index"

解釋一下上面的代碼，如果是iOS9及以上的iOS系統(tǒng)，直接跳轉(zhuǎn)到調(diào)起app的universal link。如果是安卓或者iOS9一下的iOS系統(tǒng)，就新建一個(gè)iframe，把這個(gè)iframe的src弄成調(diào)起app的scheme，然后把這個(gè)iframe直接塞到頁(yè)面的DOM樹(shù)上，然后『聽(tīng)天由命』就行。

iOS是使用universalLink(下面簡(jiǎn)稱(chēng)ulink)的方式來(lái)進(jìn)行調(diào)起。具體系統(tǒng)內(nèi)部的機(jī)制就不說(shuō)了，網(wǎng)上一堆文章，隨便搜一下就行。

universalLink其實(shí)就是一個(gè)正常的http請(qǐng)求的url。我們?cè)趆5頁(yè)面使用 location.href=XX進(jìn)行調(diào)起的時(shí)候，如果說(shuō)調(diào)起成功了，那么其實(shí)這個(gè)url是不會(huì)被訪問(wèn)的，抓包也抓不到。換句話說(shuō)，如果我們?cè)L問(wèn)到這個(gè)url了，說(shuō)明我們的調(diào)起失敗了。

上面說(shuō)了，iOS下調(diào)起失敗后，會(huì)訪問(wèn)到一個(gè)url。要實(shí)現(xiàn)沒(méi)有安轉(zhuǎn)跳下載頁(yè)，那么就直接把ulink對(duì)應(yīng)的鏈接做成下載頁(yè)就好了。根據(jù)需求，我們還可以將ulink對(duì)應(yīng)的url做成任何頁(yè)面。但是，如果我們不想要跳轉(zhuǎn)到這個(gè)頁(yè)面，還是想停留在之前的頁(yè)面呢？很簡(jiǎn)單，叫RD哥哥在通鏈那個(gè)url的服務(wù)端加一個(gè)302重定向服務(wù)就行。

舉個(gè)栗子，我們使用下面的ulink來(lái)調(diào)起App。

http://myapp.com/index?target=encodeURIComponent("http://www.baidu.com");

調(diào)起失敗后，上面那個(gè)ulink會(huì)被瀏覽器訪問(wèn)到，我們?cè)诜?wù)端加了重定向服務(wù)，我們最終會(huì)訪問(wèn)到target對(duì)應(yīng)的地址，即 http://www.baidu.com 。這樣，我們就實(shí)現(xiàn)了【調(diào)起失敗時(shí)，跳轉(zhuǎn)到自己想要的頁(yè)面】。

兩種方法：

一、需要后端重定向服務(wù)，我們只需要把上面重定向的鏈接換成一個(gè)scheme就行了。這種方法適用于頁(yè)面必須要用戶(hù)點(diǎn)擊才能觸發(fā)的交互，比如視頻、音頻的播放等。（另：微信下可以通過(guò)監(jiān)聽(tīng)jsbridge ready的事件，自動(dòng)播放視頻、音頻）

這個(gè)scheme需要滿足以下的要求：

可以被當(dāng)前瀏覽器識(shí)別

瀏覽器識(shí)別了這個(gè)scheme，但是不會(huì)進(jìn)行任何其他操作。

如果這個(gè)scheme同時(shí)滿足了上述兩個(gè)條件，那么體驗(yàn)就是最好的。否則，可能就會(huì)出現(xiàn)瀏覽器彈框等問(wèn)題。

舉幾個(gè)scheme的例子

...
facetime:// （iOS11以下體驗(yàn)完美，之后的版本會(huì)直接拉起facetime--）
ucbrowser:// 
...

二、需要后端重定向服務(wù)，我們需要把重定向鏈接換成【當(dāng)前鏈接后加一個(gè)特殊參數(shù)】的鏈接。這樣在前端代碼里就可以判斷url里面的特殊參數(shù)，從而得知當(dāng)前頁(yè)面是拉起app失敗時(shí)進(jìn)入的。

2018年初，iOS微信下全面封禁了universalLink，所以在微信下是調(diào)不起app的，暫時(shí)是沒(méi)有什么辦法。這種時(shí)候，一般可以提示用戶(hù)，從瀏覽器打開(kāi)。當(dāng)然，也可以找微信開(kāi)白名單，直接用微信的能力去拉起。

其實(shí)iOS下用scheme也是可以調(diào)起的，比如
window.location.href = scheme
但是這樣有個(gè)問(wèn)題，如果說(shuō)沒(méi)有安裝對(duì)應(yīng)的app，在safari下會(huì)彈窗：無(wú)法識(shí)別該鏈接，并且就算安裝了該app，也會(huì)彈一個(gè)窗讓你確認(rèn)是否調(diào)起 。

雖說(shuō)iOS的通鏈?zhǔn)且粋€(gè)url，但是也不是直接粘貼到safari等瀏覽器下訪問(wèn)就能直接調(diào)起app。因?yàn)閕OS的通鏈調(diào)起必須要求有用戶(hù)操作，比如點(diǎn)擊等行為。可以將鏈接粘貼到iOS的備忘錄上，點(diǎn)擊這個(gè)鏈接就可以直接調(diào)起了。

安卓的調(diào)起是用iframe的方式(其實(shí)現(xiàn)在的高版本安卓也可以直接window.location.href=scheme)。

安卓調(diào)起的最大的特點(diǎn)就是，安卓無(wú)法知道是否成功調(diào)起了app。安卓下的調(diào)起一般都會(huì)有自帶的兜底策略，比如下載。代碼也很簡(jiǎn)單

    var ifr = document.createElement("iframe");
    ifr.src = ${scheme};
    ifr.style.display = "none";
    document.body.appendChild(ifr);
    window.setTimeout(function () {
       document.body.removeChild(ifr);
       // 這里寫(xiě)兜底策略的邏輯，比如下載。
       // 當(dāng)然，也可以不加任何的兜底策略，調(diào)不起就算了。
       window.location.href = ${下載地址}
    }, 300);

如果想要實(shí)現(xiàn)【安裝了app調(diào)起，沒(méi)有安裝app下載】的功能，那么肯定會(huì)調(diào)起和下載的邏輯同時(shí)執(zhí)行，因?yàn)榘沧繜o(wú)法知道是否成功調(diào)起app。

安卓的調(diào)起是很靈活的，你可以任意控制兜底策略的邏輯，想干嘛干嘛。只是說(shuō)，兜底策略是幾乎一定會(huì)執(zhí)行的，不管你調(diào)起成功還是失敗。

很多瀏覽器都對(duì)scheme做了屏蔽。所以安卓下調(diào)不起app是一件十分正常的事情。

微信太封閉了，自然屏蔽了非自家app的調(diào)起。只新建一個(gè)iframe的方式在微信下是不能調(diào)起的。微信針對(duì)webview調(diào)起app的策略也一直在修改。最新(2018年3月19日)的想要在微信的webview下調(diào)起app的方式是：

手機(jī)上必須安裝應(yīng)用寶

使用下面的方式，跳轉(zhuǎn)到應(yīng)用寶頁(yè)面進(jìn)行調(diào)起。

    window.location.href = "http://a.app.qq.com/o/simple.jsp?pkgname=${pkgname}&android_scheme= encodeURIComponent(${scheme})"
    
    ${pkgname}表示app的包名，比如 "com.myapp"，${scheme}表示調(diào)起的scheme

其實(shí)有一種方法可以判斷安卓下是否調(diào)起成功。執(zhí)行調(diào)起邏輯后，設(shè)一定的延時(shí)判斷當(dāng)前頁(yè)面是否可見(jiàn)，若不可見(jiàn)了，幾乎就可以確定是調(diào)起成功了。但是只對(duì)小部分瀏覽器有效(比如安卓下的chrome)。對(duì)大多數(shù)瀏覽器而言，調(diào)起成功后，會(huì)有一個(gè)彈框，需要用戶(hù)點(diǎn)擊確定后，才能喚起app。由于這個(gè)彈框的存在，就無(wú)法通過(guò)頁(yè)面是否可見(jiàn)的方法來(lái)判斷調(diào)起成功與否了。而chrome下，調(diào)起成功直接喚起app，是不會(huì)彈窗的，所以chrome下可以用延時(shí)+頁(yè)面是否可見(jiàn)的方式來(lái)判斷調(diào)起成功與否。

歡迎關(guān)注我的公眾號(hào)，這里只有干活，符合預(yù)期