本文實例講解了js判斷移動端是否安裝某款app的多種方法,分享給大家供大家參考,具體內容如下
第一種方法:
一:判斷是那種設備
- var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //android終端或者uc瀏覽器
- var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios終端
二:安卓設備:原理:判斷是否認識這個協議,認識則直接跳轉,不認識就在這里下載app
- android();
- if(isAndroid){
- function android(){
- window.location.href = "openwjtr://com.tyrbl.wjtr"; /***打開app的協議,有安卓同事提供***/
- window.setTimeout(function(){
- window.location.href = "http://www.wjtr.com/download/index.html"; /***打開app的協議,有安卓同事提供***/
- },2000);
- };
二:iOS設備:原理:判斷是否認識這個協議,認識則直接跳轉,不認識就在這里下載appios();
- if(isiOS){
- function ios(){
- var ifr = document.createElement("iframe");
- ifr.src = "openwjtr://com.tyrbl.wjtr"; /***打開app的協議,有ios同事提供***/
- ifr.style.display = "none";
- document.body.appendChild(ifr);
- window.setTimeout(function(){
- document.body.removeChild(ifr);
- window.location.href = "http://www.wjtr.com/download/index.html"; /***下載app的地址***/
- },2000)
- };
- }
第二種方法:
雖然在Js中可以啟動某個app,但是並不能判斷該app是否安裝;
啟動app需要的時間較長,js中斷時間長,如果沒安裝,js瞬間就執行完畢。直接上代碼吧!
html代碼:
- <a href="javascript:testApp('tel:1868888888')">打電話</a>
js代碼:
- function testApp(url) {
- var timeout, t = 1000, hasApp = true;
- setTimeout(function () {
- if (hasApp) {
- alert('安裝了app');
- } else {
- alert('未安裝app');
- }
- document.body.removeChild(ifr);
- }, 2000)
- var t1 = Date.now();
- var ifr = document.createElement("iframe");
- ifr.setAttribute('src', url);
- ifr.setAttribute('style', 'display:none');
- document.body.appendChild(ifr);
- timeout = setTimeout(function () {
- var t2 = Date.now();
- if (!t1 || t2 - t1 < t + 100) {
- hasApp = false;
- }
- }, t);
- }
第三種方法:
最近在做項目的wap版,有個需求就是,先判斷手機上是否有我們的APP應用,如果有的話打開應用,沒有才跳轉到wap頁面。
wap簡單來說就是運行在移動端瀏覽器上的網站。不管應用在什么地方,總之就是瀏覽器唄,可以通過JS來判斷本地是否有某應用,實現方式實際就是將http協議轉為本地軟件協議。
還是直接貼代碼吧。
如下:
- <script language="javascript">
- if (navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)) {
- var loadDateTime = new Date();
- window.setTimeout(function() {
- var timeOutDateTime = new Date();
- if (timeOutDateTime - loadDateTime < 5000) {
- window.location = "要跳轉的頁面URL";
- } else {
- window.close();
- }
- },
- 25);
- window.location = " apps custom url schemes ";
- } else if (navigator.userAgent.match(/android/i)) {
- var state = null;
- try {
- state = window.open("apps custom url schemes ", '_blank');
- } catch(e) {}
- if (state) {
- window.close();
- } else {
- window.location = "要跳轉的頁面URL";
- }
- }
- </script>
apps custom url schemes 是什么呢?
其實就是你與APP約定的一個協議URL,你的ios同事或Android同事在寫程序的時候會設置一個URL Scheme,
例如設置:
URL Scheme :app
然后其他的程序就可以通過URLString = app:// 調用該應用。
還可以傳參數,如:
app://reaction/?uid=1
原理:500ms內,本機有應用程序能解析這個協議並打開程序,調用該應用;如果本機沒有應用程序能解析該協議或者500ms內沒有打開這個程序,則執行setTimeout里面的function,就是跳轉到你想跳轉的頁面。
以上就是js判斷移動端是否安裝某款app的多種方法,希望對大家的學習有所幫助。