摘要:用手機(jī)瀏覽器,就可以打開(kāi)微信客戶端,前提是你需要安裝微信客戶端。因?yàn)榧瓤梢耘袛嘤脩羰欠癜惭b客戶端,也可以停留在當(dāng)前頁(yè)面。
因?yàn)榭吹胶芏嗳嗽趩?wèn)關(guān)于頁(yè)面怎么查詢用戶安裝了什么軟件,并且調(diào)用它,我有可能說(shuō)的也不是很正確,希望讀者多多指教。
如下是我自己在項(xiàng)目中的解決方案和思路。
ios無(wú)法用這段判斷,至于原因,還沒(méi)有查明,安卓可以用。(查找到一種解決ios無(wú)法調(diào)開(kāi)客戶端的方案,但是有點(diǎn)治標(biāo)不治本,希望大牛可以指導(dǎo)一下。我已經(jīng)在最下面追加上了。)雙方協(xié)議標(biāo)注:感謝王鐵手童靴幫忙指出問(wèn)題。
這個(gè)需要提前跟客戶端開(kāi)發(fā)人員商定協(xié)議名稱,用URI Scheme作為頁(yè)面與客戶端的通訊協(xié)議(這個(gè)很重要)。這里的URI Scheme前綴不是一般的http://,而是由客戶端開(kāi)發(fā)者定義的,一般在寫(xiě)程序的時(shí)候就會(huì)設(shè)置的了。然后剩下的部分就像普通的 URL 地址一樣,需要大家來(lái)約定 URI Scheme 具體如何,例如參數(shù)是什么等等。
好比微信客戶端的是以 weixin:// 為前綴:打開(kāi)微信客戶端。用手機(jī)瀏覽器,就可以打開(kāi)微信客戶端,前提是你需要安裝微信客戶端。
現(xiàn)在已經(jīng)可以調(diào)用到客戶端了,但是咱們好像拉了一個(gè)問(wèn)題,如果用戶沒(méi)有需要調(diào)開(kāi)的客戶端怎么辦,總不能讓用戶傻傻的在當(dāng)前頁(yè)面等待,那么咱們就需要做一個(gè)判斷,來(lái)判斷用戶是否有此軟件。
判斷客戶端現(xiàn)在大體的思路有了,咱們現(xiàn)在需要明確的是,怎么做到判斷是否有軟件并且怎么下載。
這里我是通過(guò)一個(gè)隱藏的iframe做到的。因?yàn)?b>iframe既可以判斷用戶是否安裝客戶端,也可以停留在當(dāng)前頁(yè)面。
具體代碼如下:
document.getElementById("openApp").onclick = function(e) { // 通過(guò)iframe的方式試圖打開(kāi)APP,如果能正常打開(kāi),會(huì)直接切換到APP,并自動(dòng)阻止a標(biāo)簽的默認(rèn)行為 // 否則打開(kāi)a標(biāo)簽的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); }
現(xiàn)在就大功告成啦!~
不對(duì)還有一個(gè)問(wèn)題,如果是在微信端打開(kāi)的頁(yè)面怎么辦呢?微信禁止除應(yīng)用寶以外的下載鏈接,如果是這樣的話咱們還需要一個(gè)引導(dǎo)圖,來(lái)引導(dǎo)用戶怎么在微信端打開(kāi)瀏覽器,并且針對(duì)這個(gè)問(wèn)題又延伸出另外一個(gè)問(wèn)題,就是安卓版和蘋(píng)果版界面不一樣,真坑,這樣又要區(qū)分系統(tǒng),好吧,接著搞。
區(qū)分手機(jī)系統(tǒng)獲取瀏覽器的報(bào)文,查看navigator.userAgent里面的參數(shù)。比較詳細(xì)的判斷如下:(這個(gè)是我在網(wǎng)上查找的,大家覺(jué)得少可以補(bǔ)充)
原文鏈接:http://caibaojian.com/browser-ios-or-android.html trident: u.indexOf("Trident") > -1, //IE內(nèi)核 presto: u.indexOf("Presto") > -1, //opera內(nèi)核 webKit: u.indexOf("AppleWebKit") > -1, //蘋(píng)果、谷歌內(nèi)核 gecko: u.indexOf("Gecko") > -1 && u.indexOf("KHTML") == -1,//火狐內(nèi)核 mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否為移動(dòng)終端 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應(yīng)該程序,沒(méi)有頭部與底部 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等以外的任何系統(tǒng),我比較喜歡簡(jiǎn)單粗暴。 }
這個(gè)判斷也搞定了,現(xiàn)在需要的就是把代碼整合在一起。
代碼整合總結(jié)
忘了補(bǔ)充一點(diǎn),也可以做一個(gè)判斷,判斷當(dāng)前頁(yè)是否在客戶端調(diào)開(kāi),navigator.userAgent.toLowerCase()判斷里面是否有跟客戶端開(kāi)發(fā)人員擬定的協(xié)議和參數(shù)。
我的代碼如下:
// 判斷是不是客戶端 // weixin只是做一個(gè)代表,自己開(kāi)發(fā)的時(shí)候,需要把它變成你和客戶端開(kāi)發(fā)人員擬定的參數(shù)。 function isClient() { var isClient = false; var ua = navigator.userAgent.toLowerCase(); if ((ua.indexOf("weixin")) != -1) { isClient = true; } return isClient; }
最后,希望讀者指教,我自己說(shuō)的也不見(jiàn)得全對(duì),有可能有更加優(yōu)化的方案,思維的碰撞才能讓技術(shù)提成。
追加針對(duì)ios不起作用我進(jìn)行了如下修改。
我修改了html中a標(biāo)簽的鏈接,從原來(lái)的空鏈接直接修改為客戶端在AppStore中的鏈接地址。
拿百度貼吧舉例:https://itunes.apple.com/cn/a...
原來(lái)的方法不改變,這樣就可以在ios上調(diào)開(kāi)百度貼吧了。
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://m.specialneedsforspecialkids.com/yun/111494.html
摘要:用手機(jī)瀏覽器,就可以打開(kāi)微信客戶端,前提是你需要安裝微信客戶端。因?yàn)榧瓤梢耘袛嘤脩羰欠癜惭b客戶端,也可以停留在當(dāng)前頁(yè)面。 因?yàn)榭吹胶芏嗳嗽趩?wèn)關(guān)于頁(yè)面怎么查詢用戶安裝了什么軟件,并且調(diào)用它,我有可能說(shuō)的也不是很正確,希望讀者多多指教。 如下是我自己在項(xiàng)目中的解決方案和思路。 ios無(wú)法用這段判斷,至于原因,還沒(méi)有查明,安卓可以用。(查找到一種解決ios無(wú)法調(diào)開(kāi)客戶端的方案,但是有點(diǎn)治標(biāo)...
摘要:用手機(jī)瀏覽器,就可以打開(kāi)微信客戶端,前提是你需要安裝微信客戶端。因?yàn)榧瓤梢耘袛嘤脩羰欠癜惭b客戶端,也可以停留在當(dāng)前頁(yè)面。 因?yàn)榭吹胶芏嗳嗽趩?wèn)關(guān)于頁(yè)面怎么查詢用戶安裝了什么軟件,并且調(diào)用它,我有可能說(shuō)的也不是很正確,希望讀者多多指教。 如下是我自己在項(xiàng)目中的解決方案和思路。 ios無(wú)法用這段判斷,至于原因,還沒(méi)有查明,安卓可以用。(查找到一種解決ios無(wú)法調(diào)開(kāi)客戶端的方案,但是有點(diǎn)治標(biāo)...
摘要:每天新增近個(gè)新移動(dòng)病毒樣本,每秒生成個(gè)阿里聚安全移動(dòng)病毒樣本庫(kù)年新增病毒樣本達(dá)個(gè),平均每天新增個(gè)樣本,這相當(dāng)于每秒生成一個(gè)病毒樣本。阿里聚安全的人機(jī)識(shí)別系統(tǒng),接口調(diào)用是億級(jí)別,而誤識(shí)別的數(shù)量只有個(gè)位數(shù)。 《阿里聚安全2016年報(bào)》發(fā)布,本報(bào)告重點(diǎn)聚焦在2016年阿里聚安全所關(guān)注的移動(dòng)安全及數(shù)據(jù)風(fēng)控上呈現(xiàn)出來(lái)的安全風(fēng)險(xiǎn),在移動(dòng)安全方面重點(diǎn)分析了病毒、仿冒、漏洞三部分,幫助用戶了解業(yè)務(wù)安全...
閱讀 2329·2021-11-24 10:33
閱讀 1393·2019-08-30 15:43
閱讀 3285·2019-08-29 17:24
閱讀 3495·2019-08-29 14:21
閱讀 2234·2019-08-29 13:59
閱讀 1748·2019-08-29 11:12
閱讀 2820·2019-08-28 18:00
閱讀 1861·2019-08-26 12:17