javascript - 在移動端瀏覽器內判斷使用者是否安裝了某個app

現頁面上有一個“立即開啟”按鈕，如果使用者已經安裝了app，則調用相應的app開啟，否則跳轉到下載頁。

已知app的scheme

網上找到的方法1:

$(document).ready(function () {    var log = function (msg) {        $('body').before('' + msg + '');    };    var timeout, t = 1000, hasApp = true;    setTimeout(function () {        if (hasApp) {            log('安裝了app');        } else {            log('未安裝app');        }    }, 2000);    function testApp() {        var t1 = Date.now();        var ifr = $('');        ifr.attr('src', 'diaodiao://');        $('body').append(ifr);        // 插入之後，過1000ms執行try_to_open_app方法        timeout = setTimeout(function () {            try_to_open_app(t1);        }, t);    }    function try_to_open_app(t1) {        var t2 = Date.now();        if (!t1 || t2 - t1 < t + 200) {            hasApp = false;        }    }    testApp();});

方法1並不起作用，頁面上打的log永遠都是“未安裝app”

網上找的方法2:

window.onload = function(){    function isInstalled(){        var originHref = location.href;        var url = originHref.substring(originHref.indexOf('//')+2);        var schemeUrl = "diaodiao://"+url;        window.location=schemeUrl;//開啟某手機上的某個app應用        setTimeout(function(){            window.location="http://a.app.qq.com/o/simple.jsp?pkgname=com.diaox2.android&ckey=CK1308661595241";//如果逾時就跳轉到app下載頁        },20000);    }    var downlink = document.querySelector('.downlink');    downlink.addEventListener('click',function(){        isInstalled();    },false)}

此方法的問題在於，window.location=schemeUrl;這句代碼執行之後，safari彈出一個對話方塊，問要不要使用相應的app開啟，然後緊接著就跳轉到了下載連結（不是定時了嗎？不知道為什麼定時器不起作用？）

-----------------new-------------------

上面2種方法肯定有其適用的時期，這些至少是1年多之前的解決辦法了，隨著IOS/Android系統及瀏覽器的更新，現在已經不適用。。使用iframe呼起app，我在IOS8.3下的safari中是可以呼起的，但是在9.2.1下的safari是不可以的。在Android5.0.1下測試也通不過，只有在Android Chrome下才能呼起。。

遇到一個跟我問題想似的哥們兒，但是貌似沒有很好的回答
ios9下在瀏覽器中通過scheme開啟app的問題
-----------------new-------------------

終於解決了（雖然不那麼優雅，沒有覆蓋所有瀏覽器或webview），寫了一份文檔：
關於在瀏覽器中判斷是否安裝app

同時，謝謝各位不吝賜教！

回複內容：

現頁面上有一個“立即開啟”按鈕，如果使用者已經安裝了app，則調用相應的app開啟，否則跳轉到下載頁。

已知app的scheme

網上找到的方法1:

$(document).ready(function () {    var log = function (msg) {        $('body').before('' + msg + '');    };    var timeout, t = 1000, hasApp = true;    setTimeout(function () {        if (hasApp) {            log('安裝了app');        } else {            log('未安裝app');        }    }, 2000);    function testApp() {        var t1 = Date.now();        var ifr = $('');        ifr.attr('src', 'diaodiao://');        $('body').append(ifr);        // 插入之後，過1000ms執行try_to_open_app方法        timeout = setTimeout(function () {            try_to_open_app(t1);        }, t);    }    function try_to_open_app(t1) {        var t2 = Date.now();        if (!t1 || t2 - t1 < t + 200) {            hasApp = false;        }    }    testApp();});

方法1並不起作用，頁面上打的log永遠都是“未安裝app”

網上找的方法2:

window.onload = function(){    function isInstalled(){        var originHref = location.href;        var url = originHref.substring(originHref.indexOf('//')+2);        var schemeUrl = "diaodiao://"+url;        window.location=schemeUrl;//開啟某手機上的某個app應用        setTimeout(function(){            window.location="http://a.app.qq.com/o/simple.jsp?pkgname=com.diaox2.android&ckey=CK1308661595241";//如果逾時就跳轉到app下載頁        },20000);    }    var downlink = document.querySelector('.downlink');    downlink.addEventListener('click',function(){        isInstalled();    },false)}

此方法的問題在於，window.location=schemeUrl;這句代碼執行之後，safari彈出一個對話方塊，問要不要使用相應的app開啟，然後緊接著就跳轉到了下載連結（不是定時了嗎？不知道為什麼定時器不起作用？）

-----------------new-------------------

上面2種方法肯定有其適用的時期，這些至少是1年多之前的解決辦法了，隨著IOS/Android系統及瀏覽器的更新，現在已經不適用。。使用iframe呼起app，我在IOS8.3下的safari中是可以呼起的，但是在9.2.1下的safari是不可以的。在Android5.0.1下測試也通不過，只有在Android Chrome下才能呼起。。

遇到一個跟我問題想似的哥們兒，但是貌似沒有很好的回答
ios9下在瀏覽器中通過scheme開啟app的問題
-----------------new-------------------

終於解決了（雖然不那麼優雅，沒有覆蓋所有瀏覽器或webview），寫了一份文檔：
關於在瀏覽器中判斷是否安裝app

同時，謝謝各位不吝賜教！

話說好像是這樣，ios下面通常用iframe來開啟你的scheme地址； Android下通常用location.href來。。。
不過實際情況好像比這個複雜得多。。。。
樓主可以參考下這個：http://js.40017.cn/touch/hb/p/openApp.js

暫時沒有測試
先提出一個有可能的解決方案。

非同步請求一下scheme，擷取狀態代碼。（如果scheme有狀態代碼則成立的解決方案）

或者可以直接忽略是否正常開啟了app

用iframe來嘗試開啟scheme uri，不管成不成功，都顯示一個前往下載app

麻煩問下，你寫的
setTimeout(function () {

var timeOutDateTime = new Date();if (!loadDateTime || timeOutDateTime - loadDateTime < 1010) {   window.location = self.dataset.href;}        

},1000);
window.location = 'diaodiao://';

loadDateTime 在哪定義呢，有完整的嗎？

大概說一下iOS9吧，
最近剛把自己的webapp用phonegap打了個包，然後要判斷手機上是不是裝了這個app，如果裝了的話，要能從內容頁直接跳進app中，而且，需求是不能看見那個alert框。
在iOS9下是ok的，只要有一個apple那邊可以認可的https的串連就好。關鍵詞是 Universal Link.網易新聞用的就是這種方式，測試之後，基本能達到判斷的需求。

