关于vue.js:vue中h5端打开app判断是安卓还是苹果

1.开发环境 vue+vant
2.电脑系统 windows10专业版
3.在h5端开发的过程中,咱们常常须要点击一个按钮来判断用户应用装置了app(首先判断是安卓还是苹果,而后判断是否装置了app,如果没有装置则跳转到下载页面,如果装置了则关上)。
4.废话不多说,间接上代码:

<div class="xiding-r" @click="openapp"> Open APP</div>

5.在methods中增加如下代码:

   openapp() {    var u = navigator.userAgent,     app = navigator.appVersion;    var isAndroid = u.indexOf("Android") > -1 || u.indexOf("Linux") > -1;    var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);    if (isAndroid) {     // alert("我是安卓");     this.android();    }    if (isIOS) {     // alert("我是苹果");    }   },

android() {    var _clickTime = new Date().getTime();    window.location.href = 'zhihu://'; /***关上app的协定，有安卓共事提供***/    //启动距离20ms运行的定时器，并检测累计耗费工夫是否超过3000ms，超过则完结    var _count = 0, intHandle;    intHandle = setInterval(function () {     _count++;     var elsTime = new Date().getTime() - _clickTime;     if (_count >= 100 || elsTime > 5000) {      console.log(_count)      console.log(elsTime)      clearInterval(intHandle);      //查看app是否关上      if (document.hidden || document.webkitHidden) {       // 关上了       window.location.href = "zhihu://";       // alert('关上了');       window.close();       // return;      } else {       // 没关上       // alert('没关上');       window.location.href = "";//下载链接      }     }    }, 20);   },

5.留神:在这个案例中我是用的知乎的例子:

6.留神

应用Custom URL Scheme的益处就是,你能够在其余程序中通过这个url关上应用程序。如果A应用程序注册了一个 url scheme:myApp,那么就在mobile浏览器中就能够通过<a href ="myApp://">关上你的应用程序。请留神,IOS中如果零碎注册了 url schemen且装置了那个应用程序,通过下面那种网页的形式就能够关上应用程序(亲测无效)。留神:IOS中不能注册为http://xxx这样的url scheme,而android是能够的。

7.本期的分享到了这里就完结啦,心愿对你有所帮忙,让咱们一起致力走向巅峰。