国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

移動端判斷用戶是否安裝客戶端

FrozenMap / 1824人閱讀

摘要:用手機瀏覽器,就可以打開微信客戶端,前提是你需要安裝微信客戶端。因為既可以判斷用戶是否安裝客戶端,也可以停留在當前頁面。

因為看到很多人在問關于頁面怎么查詢用戶安裝了什么軟件,并且調用它,我有可能說的也不是很正確,希望讀者多多指教。

如下是我自己在項目中的解決方案和思路。

ios無法用這段判斷,至于原因,還沒有查明,安卓可以用。(查找到一種解決ios無法調開客戶端的方案,但是有點治標不治本,希望大牛可以指導一下。我已經在最下面追加上了。)

標注:感謝王鐵手童靴幫忙指出問題。

雙方協議

這個需要提前跟客戶端開發人員商定協議名稱,用URI Scheme作為頁面與客戶端的通訊協議(這個很重要)。這里的URI Scheme前綴不是一般的http://,而是由客戶端開發者定義的,一般在寫程序的時候就會設置的了。然后剩下的部分就像普通的 URL 地址一樣,需要大家來約定 URI Scheme 具體如何,例如參數是什么等等。

好比微信客戶端的是以 weixin:// 為前綴:打開微信客戶端用手機瀏覽器,就可以打開微信客戶端,前提是你需要安裝微信客戶端。

現在已經可以調用到客戶端了,但是咱們好像拉了一個問題,如果用戶沒有需要調開的客戶端怎么辦,總不能讓用戶傻傻的在當前頁面等待,那么咱們就需要做一個判斷,來判斷用戶是否有此軟件。

判斷客戶端

現在大體的思路有了,咱們現在需要明確的是,怎么做到判斷是否有軟件并且怎么下載。

這里我是通過一個隱藏的iframe做到的。因為iframe既可以判斷用戶是否安裝客戶端,也可以停留在當前頁面。
具體代碼如下:

document.getElementById("openApp").onclick = function(e) {
        // 通過iframe的方式試圖打開APP,如果能正常打開,會直接切換到APP,并自動阻止a標簽的默認行為
        // 否則打開a標簽的href鏈接
        var ifrSrc = "weixin://";
        if (!ifrSrc) {
            return;
        }
        var ifr = document.createElement("iframe");
        ifr.src = ifrSrc;
        ifr.style.display = "none";
        document.body.appendChild(ifr);
        setTimeout(function() {
            document.body.removeChild(ifr);
        }, 1000);

    };
    if (document.all) {
        document.getElementById("openApp").click();
    }
    // 其它瀏覽器
    else {
        var e = document.createEvent("MouseEvents");
        e.initEvent("click", true, true);
        document.getElementById("openApp").dispatchEvent(e);
    }

現在就大功告成啦!~

不對還有一個問題,如果是在微信端打開的頁面怎么辦呢?微信禁止除應用寶以外的下載鏈接,如果是這樣的話咱們還需要一個引導圖,來引導用戶怎么在微信端打開瀏覽器,并且針對這個問題又延伸出另外一個問題,就是安卓版和蘋果版界面不一樣,真坑,這樣又要區分系統,好吧,接著搞。

區分手機系統

獲取瀏覽器的報文,查看navigator.userAgent里面的參數。比較詳細的判斷如下:(這個是我在網上查找的,大家覺得少可以補充)

原文鏈接:http://caibaojian.com/browser-ios-or-android.html
trident: u.indexOf("Trident") > -1, //IE內核 
presto: u.indexOf("Presto") > -1, //opera內核 
webKit: u.indexOf("AppleWebKit") > -1, //蘋果、谷歌內核 
gecko: u.indexOf("Gecko") > -1 && u.indexOf("KHTML") == -1,//火狐內核 
mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否為移動終端 
ios: !!u.match(/(i[^;]+;( U;)? CPU.+Mac OS X/), //ios終端 
android: u.indexOf("Android") > -1 || u.indexOf("Adr") > -1, //android終端 
iPhone: u.indexOf("iPhone") > -1 , //是否為iPhone或者QQHD瀏覽器 
iPad: u.indexOf("iPad") > -1, //是否iPad 
webApp: u.indexOf("Safari") == -1, //是否web應該程序,沒有頭部與底部 
weixin: u.indexOf("MicroMessenger") > -1, //是否微信 (2015-01-22新增) 
qq: u.match(/sQQ/i) == " qq" //是否QQ

如下是我自己的判斷:

var pattern = new RegExp(/iPad|iPod|iPhone/i);
var iosUserAgent = pattern.test(navigator.userAgent);
if(iosUserAgent){
    var ua = navigator.userAgent.toLowerCase();
    if(ua.match(/MicroMessenger/i)=="micromessenger"){
        //你用的是IOS的微信客戶端
    }else{
        //你用的是IOS客戶端
    }
}else if(navigator.userAgent.match(/Android/i)) {
    var ua = navigator.userAgent.toLowerCase();
    if(ua.match(/MicroMessenger/i)=="micromessenger"){
        //你用的是安卓的微信客戶端
    }else{    
        //你用的是安卓客戶端
    }
}
else {
    //其他、widows phone、pc等以外的任何系統,我比較喜歡簡單粗暴。
}

這個判斷也搞定了,現在需要的就是把代碼整合在一起。

代碼整合

總結

忘了補充一點,也可以做一個判斷,判斷當前頁是否在客戶端調開,navigator.userAgent.toLowerCase()判斷里面是否有跟客戶端開發人員擬定的協議和參數。

我的代碼如下:

// 判斷是不是客戶端  
// weixin只是做一個代表,自己開發的時候,需要把它變成你和客戶端開發人員擬定的參數。
function isClient() {
    var isClient = false;
    var ua = navigator.userAgent.toLowerCase();
    if ((ua.indexOf("weixin")) != -1) {
        isClient = true;
    }
    return isClient;
}

最后,希望讀者指教,我自己說的也不見得全對,有可能有更加優化的方案,思維的碰撞才能讓技術提成。

追加

針對ios不起作用我進行了如下修改。
我修改了html中a標簽的鏈接,從原來的空鏈接直接修改為客戶端在AppStore中的鏈接地址。
拿百度貼吧舉例:https://itunes.apple.com/cn/a...


原來的方法不改變,這樣就可以在ios上調開百度貼吧了。

文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。

轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/80227.html

相關文章

  • 移動判斷用戶是否安裝客戶

    摘要:用手機瀏覽器,就可以打開微信客戶端,前提是你需要安裝微信客戶端。因為既可以判斷用戶是否安裝客戶端,也可以停留在當前頁面。 因為看到很多人在問關于頁面怎么查詢用戶安裝了什么軟件,并且調用它,我有可能說的也不是很正確,希望讀者多多指教。 如下是我自己在項目中的解決方案和思路。 ios無法用這段判斷,至于原因,還沒有查明,安卓可以用。(查找到一種解決ios無法調開客戶端的方案,但是有點治標...

    wwolf 評論0 收藏0
  • 移動判斷用戶是否安裝客戶

    摘要:用手機瀏覽器,就可以打開微信客戶端,前提是你需要安裝微信客戶端。因為既可以判斷用戶是否安裝客戶端,也可以停留在當前頁面。 因為看到很多人在問關于頁面怎么查詢用戶安裝了什么軟件,并且調用它,我有可能說的也不是很正確,希望讀者多多指教。 如下是我自己在項目中的解決方案和思路。 ios無法用這段判斷,至于原因,還沒有查明,安卓可以用。(查找到一種解決ios無法調開客戶端的方案,但是有點治標...

    EsgynChina 評論0 收藏0
  • 《阿里聚安全2016年報》

    摘要:每天新增近個新移動病毒樣本,每秒生成個阿里聚安全移動病毒樣本庫年新增病毒樣本達個,平均每天新增個樣本,這相當于每秒生成一個病毒樣本。阿里聚安全的人機識別系統,接口調用是億級別,而誤識別的數量只有個位數。 《阿里聚安全2016年報》發布,本報告重點聚焦在2016年阿里聚安全所關注的移動安全及數據風控上呈現出來的安全風險,在移動安全方面重點分析了病毒、仿冒、漏洞三部分,幫助用戶了解業務安全...

    2json 評論0 收藏0

發表評論

0條評論

最新活動
閱讀需要支付1元查看
<