js判断移动端是否安装某款app的多种方法


Posted in Javascript onDecember 18, 2015

本文实例讲解了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的多种方法,希望对大家的学习有所帮助。

Javascript 相关文章推荐
js中for in的用法示例解析
Dec 25 Javascript
jquery模拟LCD 时钟的html文件源代码
Jun 16 Javascript
jQuery实现3D文字特效的方法
Mar 10 Javascript
javascript Slip.js实现整屏滑动的手机网页
Nov 25 Javascript
最简单的tab切换实例代码
May 13 Javascript
jQuery文字提示与图片提示效果实现方法
Jul 04 Javascript
引用jquery框架后出错的解决方法
Aug 09 Javascript
详解Jquery的事件操作和文档操作
Dec 19 Javascript
Bootstrap布局之栅格系统学习笔记
May 04 Javascript
vue.js select下拉框绑定和取值方法
Mar 03 Javascript
JavaScript this使用方法图解
Feb 04 Javascript
node koa2 ssr项目搭建的方法步骤
Dec 11 Javascript
javascript实现保留两位小数的多种方法
Dec 18 #Javascript
原生js实现图片轮播特效
Dec 18 #Javascript
js表单中选择框值的获取及表单的序列化
Dec 17 #Javascript
浏览器兼容性问题大汇总
Dec 17 #Javascript
js跨浏览器的事件侦听器和事件对象的使用方法
Dec 17 #Javascript
js调出上下文菜单的实例
Dec 17 #Javascript
快速掌握WordPress中加载JavaScript脚本的方法
Dec 17 #Javascript
You might like
php随机显示图片的简单示例
2014/02/15 PHP
CodeIgniter框架数据库事务处理的设计缺陷和解决方案
2014/07/25 PHP
PHP清除字符串中所有无用标签的方法
2014/12/01 PHP
jQuery实现长文字部分显示代码
2013/05/13 Javascript
EXTjs4.0的store的findRecord的BUG演示代码
2013/06/08 Javascript
jquery js 重置表单 reset()具体实现代码
2013/08/05 Javascript
当滚动条滚动到页面底部自动加载增加内容的js代码
2014/05/13 Javascript
js实现点击后将文字或图片复制到剪贴板的方法
2014/08/04 Javascript
理解 JavaScript Scoping &amp; Hoisting(二)
2015/11/18 Javascript
关于JS 预解释的相关理解
2016/06/28 Javascript
JavaScript中的对象和原型(一)
2016/08/12 Javascript
vue2.0 实现导航守卫(路由守卫)
2018/05/21 Javascript
解决jquery的ajax调取后端数据成功却渲染失败的问题
2018/08/08 jQuery
在vue中使用SockJS实现webSocket通信的过程
2018/08/29 Javascript
在vue中利用v-html按分号将文本换行的例子
2019/11/14 Javascript
Python3.5 创建文件的简单实例
2018/04/26 Python
Python3多线程操作简单示例
2018/05/22 Python
python正则-re的用法详解
2019/07/28 Python
Python函数的定义方式与函数参数问题实例分析
2019/12/26 Python
Python+Appium实现自动化测试的使用步骤
2020/03/24 Python
Python字典fromkeys()方法使用代码实例
2020/07/20 Python
CSS3支持IE6, 7, and 8的边框border属性
2012/12/28 HTML / CSS
HTML5实现音频和视频嵌入的方法
2018/08/22 HTML / CSS
Lululemon英国官网:加拿大瑜伽服装品牌
2019/01/14 全球购物
英国Radley包德国官网:Radley London德国
2019/11/18 全球购物
《自然之道》教学反思
2014/02/11 职场文书
妇联主席先进事迹
2014/05/18 职场文书
机关领导干部作风整顿整改措施
2014/09/19 职场文书
小学向国旗敬礼活动方案
2014/09/27 职场文书
党的群众路线教育实践活动个人整改措施
2014/10/27 职场文书
六年级学生评语大全
2014/12/26 职场文书
幼儿园辞职书
2015/02/26 职场文书
世界气象日活动总结
2015/02/27 职场文书
撤诉申请怎么写
2015/05/19 职场文书
干货:企业内部人才推荐奖励方案!
2019/07/09 职场文书
标准演讲稿格式结尾应该怎么书写?
2019/07/17 职场文书