摘要：很好的一個(gè)屬性，因?yàn)橥ㄟ^這個(gè)屬性在上我們能夠繞過微信的攔截從而打開。微信中打開至此只有微信是打不開的，實(shí)際上騰訊系的產(chǎn)品都是打不開的，包括瀏覽器。簡(jiǎn)而言之，騰訊的產(chǎn)品中都去借助應(yīng)用寶這個(gè)平臺(tái)去執(zhí)行你需要的操作。

先聲明一下關(guān)于ios中9.0打開方式的文章來自博客：IOS9通用鏈接（universal link）

對(duì)于一個(gè)完備的互聯(lián)網(wǎng)產(chǎn)品而言需要有app端與web端兩個(gè)不同前端，對(duì)于產(chǎn)品而言很多都希望能夠?qū)ap頁上的用戶引向native app上這就要求前端工程師們?yōu)榫W(wǎng)頁提供各種入口去打開app，今天我們就聊一聊app的打開方式（有錯(cuò)誤的地方還請(qǐng)高手指正）。

對(duì)于app打開而言最常規(guī)的打開就是通過url scheme的方式去打開你的app，如下的

myapp://
myapp://open
myapp://type=1&id=2sdeo223lwe

這些拋出都是以u(píng)rl的方式進(jìn)行拋出，app捕捉到這些拋出去做相應(yīng)的處理，本文對(duì)app的處理不做詳細(xì)描述，app開發(fā)請(qǐng)自行谷歌百度。對(duì)于前端而言拋出的方式也有很多，而最理想的方式是通過iframe的src對(duì)其進(jìn)行鏈拋出，來！說的在多都沒有代碼來的清晰，請(qǐng)看下面。

首先我們需要有一個(gè)iframe：

//實(shí)際上就是新建一個(gè)iframe的生成器
var  createIframe=(function(){
  var iframe;
    return function(){
        if(iframe){
            return iframe;
        }else{
            iframe = document.createElement("iframe");
            iframe.style.display = "none";
            document.body.appendChild(iframe);
            return iframe;      
        }
    }
})()

之后我們還需要一個(gè)url scheme:

//生成一個(gè)url scheme,假設(shè)我們約定的scheme是myApp://type=1&id=iewo212j32這種形式的

var baseScheme = "myApp://"
var createScheme=function(options){
    var urlScheme=baseScheme;
    for(var item in options){
        urlScheme=urlScheme+item + "=" + encodeURIComponent(options[item]) + "&";
    }
    urlScheme = urlScheme.substring(0, urlScheme.length - 1);
    return encodeURIComponent(urlScheme);
}

這種scheme形式的其實(shí)不是最好的,根據(jù)我們踩過的坑，覺得約定為與http協(xié)議相近可能更好一些，具體的協(xié)議需要前端人員自己去和app端人員約定。

ok萬事具備，iframe有了，urlScheme也有了，該去打開app了

var openApp=function(){
    var localUrl=createScheme();
    var openIframe=createIframe();
    if(isIos()){
        //判斷是否是ios,具體的判斷函數(shù)自行百度
        window.location.href = localUrl;
        var loadDateTime = Date.now();
        setTimeout(function () {
            var timeOutDateTime = Date.now();
            if (timeOutDateTime - loadDateTime < 1000) {
                window.location.href = "你的下載頁面";
            }
        }, 25);
    }else if(isAndroid()){
        //判斷是否是android，具體的判斷函數(shù)自行百度
        if (isChrome()) {
            //chrome瀏覽器用iframe打不開得直接去打開，算一個(gè)坑
            window.location.href = localUrl;
        } else {
            //拋出你的scheme
            openIframe.src = localUrl;
        }
        setTimeout(function () {
            window.location.href = "你的下載頁面";
        }, 500);
    }else{
        //主要是給winphone的用戶準(zhǔn)備的,實(shí)際都沒測(cè)過，現(xiàn)在winphone不好找啊
        openIframe.src = localUrl;
        setTimeout(function () {
            window.location.href = "你的下載頁面";
        }, 500);
    }
}

以上就是你要打開scheme的主要代碼了，好吧，實(shí)際上不只是打開app，還要實(shí)現(xiàn)未打開的時(shí)候跳到下載頁去。其中安卓實(shí)際上無論有沒有打開都會(huì)跳到下載頁去，而ios........好吧!按照網(wǎng)上的說法是瀏覽器失焦后會(huì)掛起腳本，呵呵，這是多老的ios版本的表現(xiàn)了，實(shí)際上現(xiàn)在的ios已經(jīng)沒有這么做，有些版本會(huì)跟安卓的表現(xiàn)一樣，而有些則是直接跳轉(zhuǎn)根本不會(huì)去打開，還有打開的時(shí)候那個(gè)惡心的系統(tǒng)彈窗是什么鬼。好吧，實(shí)際上至此你會(huì)發(fā)現(xiàn)，ios9.0以上的有些打不開直接跳，有些打得開還會(huì)有允許彈窗，而微信則是無論如何都打不開，實(shí)際上微信會(huì)在他的瀏覽器里攔截掉所有未經(jīng)其允許的scheme包括app store，那么接下來我們要解決這些問題。

針對(duì)ios9及以上的打不開問題，實(shí)際上ios9提供了更好的解決方案————通用鏈接。

什么是Universal Links(通用鏈接)?

這是iOS9推出的一項(xiàng)功能，如果你的應(yīng)用支持Universal Links(通用鏈接)，那么就能夠方便的通過傳統(tǒng)的HTTP鏈接來啟動(dòng)APP(如果iOS設(shè)備上已經(jīng)安裝了你的app，不需要額外做任何判斷等)，或者打開網(wǎng)頁(iOS設(shè)備上沒有安裝你的app)?；蛟S可以更簡(jiǎn)單點(diǎn)來說明，在iOS9之前，對(duì)于從各種從瀏覽器，Safari、UIWebView或者 WKWebView中喚醒APP的需求，我們通常只能使用scheme。

以上來自網(wǎng)上關(guān)于通用鏈接的介紹，對(duì)于前端簡(jiǎn)單點(diǎn)講就是你訪問一個(gè)http的url，如果這個(gè)url帶有你提交給開發(fā)平臺(tái)的配置文件中匹配規(guī)則的內(nèi)容，ios系統(tǒng)會(huì)去嘗試打開你的app，如果打不開，系統(tǒng)就會(huì)在瀏覽器中轉(zhuǎn)向你要訪問的鏈接。很好的一個(gè)屬性，因?yàn)橥ㄟ^這個(gè)屬性在ios9上我們能夠繞過微信的攔截從而打開app。

以下是ios開發(fā)人員要做的百度搜索結(jié)果第一條ios中實(shí)現(xiàn)通用鏈接：

而我們要做的真的很簡(jiǎn)單，實(shí)際上我們只需要拋出鏈接就好了（實(shí)際上博主只是來騙經(jīng)驗(yàn)的）。在此之前請(qǐng)準(zhǔn)備好與主站不同的域名，比如主站www.xxxx.com，你們可以準(zhǔn)備好open.xxxx.com的域名作為重定向用。好吧！實(shí)際上通用鏈接有一個(gè)很坑的屬性，必須是異域打開，而且如果你提交的是你主站的鏈接，你打開你的主站你會(huì)發(fā)現(xiàn)網(wǎng)站上方會(huì)掛著一個(gè)難看的灰條轉(zhuǎn)向appstore中你們的app，沒錯(cuò)，就是ios系統(tǒng)干的這個(gè)事，具體的其他注意事項(xiàng)可以參考這篇文章IOS9通用鏈接（universal link）。

那么接下來我們的代碼得做好更改

//增加通用鏈接的生成,
var baseScheme = "myApp://",
    baseLink="http://m.xxxx.com?";
var createScheme=function(options,isLink){
    var urlScheme=isLink?baseLink:baseScheme;
    for(var item in options){
        urlScheme=urlScheme+item + "=" + encodeURIComponent(options[item]) + "&";
    }
    urlScheme = urlScheme.substring(0, urlScheme.length - 1);
    return isLink?urlScheme:encodeURIComponent(urlScheme);
}

然后對(duì)拋出做

var openApp=function(){
    //生成你的scheme你也可以選擇外部傳入
    var localUrl=createScheme({type:1,id:"sdsdewe2122"});
    var openIframe=createIframe();
    if(isIos()){
        //判斷是否是ios,具體的判斷函數(shù)自行百度
        if(isGreaterThan9()){
            //判斷是否為ios9以上的版本,跟其他判斷一樣navigator.userAgent判斷,ios會(huì)有帶版本號(hào)
            localUrl=createScheme({type:1,id:"sdsdewe2122"},true);//代碼還可以優(yōu)化一下
            location.href = localUrl;//實(shí)際上不少產(chǎn)品會(huì)選擇一開始將鏈接寫入到用戶需要點(diǎn)擊的a標(biāo)簽里
            return;
        }
        window.location.href = localUrl;
        var loadDateTime = Date.now();
        setTimeout(function () {
            var timeOutDateTime = Date.now();
            if (timeOutDateTime - loadDateTime < 1000) {
                window.location.href = "你的下載頁面";
            }
        }, 25);
    }else if(isAndroid()){
        //判斷是否是android，具體的判斷函數(shù)自行百度
        if (isChrome()) {
            //chrome瀏覽器用iframe打不開得直接去打開，算一個(gè)坑
            window.location.href = localUrl;
        } else {
            //拋出你的scheme
            openIframe.src = localUrl;
        }
        setTimeout(function () {
            window.location.href = "你的下載頁面";
        }, 500);
    }else{
        //主要是給winphone的用戶準(zhǔn)備的,實(shí)際都沒測(cè)過，現(xiàn)在winphone不好找啊
        openIframe.src = localUrl;
        setTimeout(function () {
            window.location.href = "你的下載頁面";
        }, 500);
    }
}

實(shí)際上就只需要更改這么點(diǎn)，最重要的是app端接入通用鏈接，注意拋出的鏈接不要跟主站同域即可，之后就是不斷的調(diào)試，自己去踩坑吧，記得綁定域名，這個(gè)對(duì)域名具有一定的依賴性。

至此只有微信是打不開的，實(shí)際上騰訊系的產(chǎn)品都是打不開的，包括qq瀏覽器。

對(duì)于微信中有兩種方式：

一種簡(jiǎn)單的方式就是彈窗告訴用戶讓他去瀏覽器中打開——在技術(shù)之外的辦法

還有一種方式就是應(yīng)用寶

是的如果是微信就去打開你的app對(duì)應(yīng)的應(yīng)用寶，應(yīng)用寶會(huì)去檢測(cè)你的app是否存在有則去打開，但只是去打開。實(shí)際上騰訊的應(yīng)用寶對(duì)于開發(fā)者在功能上做的比想象中的要強(qiáng)大，你在應(yīng)用寶的微下載中配置申請(qǐng)你的applink與app store的鏈接,之后你只要在你的鏈接參數(shù)中帶上android_schema="myApp://"就在應(yīng)用寶中打開app中的特定功能，如果忽略應(yīng)用寶的頁面跟自己scheme打開沒有太大區(qū)別，具體的操作可以查看應(yīng)用寶的說明。簡(jiǎn)而言之，騰訊的產(chǎn)品中都去借助應(yīng)用寶這個(gè)平臺(tái)去執(zhí)行你需要的操作。在此就不貼代碼了，只要判斷瀏覽器如果是微信或者是qq就去跳你的應(yīng)用寶鏈接就行。

實(shí)際上單純打開app非常簡(jiǎn)單，目前無論安卓還是ios都能夠很好的支持scheme，當(dāng)然騰訊系產(chǎn)品除外，實(shí)際上百度瀏覽器也會(huì)攔截scheme（我覺得真是奇了葩?。?！微信這種尚能理解，一個(gè)瀏覽器居然擅自去攔截scheme）目前對(duì)百度瀏覽器還沒有什么很好的辦法，可以嘗試是否能夠通過百度應(yīng)用市場(chǎng)去解決。如果是希望打開app同時(shí)又要打開下載頁，那么ios9及以上就得用通用鏈接去解決，重點(diǎn)就是這個(gè)通用鏈接。