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 相关文章推荐
JQuery 学习笔记 选择器之一
Jul 23 Javascript
简洁短小的 JavaScript IE 浏览器判定代码
Mar 21 Javascript
JQuery Dialog的内存泄露问题解决方法
Jun 18 Javascript
基于JQuery制作的产品广告效果
Dec 08 Javascript
jQuery学习笔记之jQuery动画效果
Sep 09 Javascript
jQuery实现选项卡切换效果简单演示
Dec 09 Javascript
浅谈JavaScript中的this指针和引用知识
Aug 05 Javascript
前端框架Vue.js构建大型应用浅析
Sep 12 Javascript
深入理解JavaScript中的预解析
Jan 04 Javascript
JavaScript对象引用与赋值实例详解
Mar 15 Javascript
JavaScript undefined及null区别实例解析
Jul 21 Javascript
Vue使用轮询定时发送请求代码
Aug 10 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安全性漫谈
2012/06/28 PHP
PHP中空字符串介绍0、null、empty和false之间的关系
2012/09/25 PHP
php缩放图片(根据宽高的等比例缩放)实例介绍
2013/06/09 PHP
PHP判断远程图片或文件是否存在的实现代码
2014/02/20 PHP
Symfony2安装的方法(2种方法)
2016/02/04 PHP
在textarea中显示html页面的javascript代码
2007/04/20 Javascript
jQuery 白痴级入门教程
2009/11/11 Javascript
利用Keydown事件阻止用户输入实现代码
2014/03/11 Javascript
Javascript排序算法之合并排序(归并排序)的2个例子
2014/04/04 Javascript
JS创建类和对象的两种不同方式
2014/08/08 Javascript
javascript制作游戏开发碰撞检测的封装代码
2015/03/31 Javascript
JavaScript获取页面中表单(form)数量的方法
2015/04/03 Javascript
JavaScript实现把rgb颜色转换成16进制颜色的方法
2015/06/01 Javascript
JS实现“隐藏与显示”功能(多种方法)
2016/11/24 Javascript
微信公众号开发 自定义菜单跳转页面并获取用户信息实例详解
2016/12/08 Javascript
基于AngularJS实现表单验证功能
2017/07/28 Javascript
深入了解javascript 数组的sort方法
2018/06/01 Javascript
浅析vue-cli3配置webpack-bundle-analyzer插件【推荐】
2019/10/23 Javascript
Python 使用 PyMysql、DBUtils 创建连接池提升性能
2019/08/14 Python
Django数据库操作之save与update的使用
2020/04/01 Python
为什么称python为胶水语言
2020/06/16 Python
纯CSS3实现图片无间断轮播效果
2016/08/25 HTML / CSS
CSS3关于z-index不生效问题的解决
2020/02/19 HTML / CSS
html5 桌面提醒:Notifycations应用介绍
2012/11/27 HTML / CSS
世界上最大的街头服饰网站:Karmaloop
2017/02/04 全球购物
“型”走纽约上东区:Sam Edelman
2017/04/02 全球购物
Kappa英国官方在线商店:服装和运动器材
2020/11/22 全球购物
国际金融专业大学生职业生涯规划书
2013/12/28 职场文书
酒吧创业计划书
2014/01/18 职场文书
酒店优秀员工事迹材料
2014/06/02 职场文书
2014年销售员工作总结
2014/12/01 职场文书
出生公证书
2015/01/23 职场文书
幼儿园安全工作总结2015
2015/04/20 职场文书
2015年医生个人工作总结
2015/04/25 职场文书
2015年学校综合治理工作总结
2015/07/20 职场文书
react antd实现动态增减表单
2021/06/03 Javascript