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 相关文章推荐
理解Javascript_07_理解instanceof实现原理
Oct 15 Javascript
如何用JavaScript动态呼叫函数(两种方式)
May 03 Javascript
javascript遍历控件实例详细解析
Jan 10 Javascript
javascript校验价格合法性实例(必须输入2位小数)
May 05 Javascript
javascript时间函数大全
Jun 30 Javascript
js实现带缓冲效果的仿QQ面板折叠菜单代码
Sep 06 Javascript
JS实现鼠标滑过链接改变网页背景颜色的方法
Oct 20 Javascript
基于BootStrap Metronic开发框架经验小结【五】Bootstrap File Input文件上传插件的用法详解
May 12 Javascript
微信小程序 聊天室简单实现
Apr 19 Javascript
node.js调用Chrome浏览器打开链接地址的方法
May 17 Javascript
微信小程序实现流程进度的图样式功能
Jan 16 Javascript
Vue一个案例引发的递归组件的使用详解
Nov 15 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/03/25 PHP
浅析iis7.5安装配置php环境
2015/05/10 PHP
PHP实现将几张照片拼接到一起的合成图片功能【便于整体打印输出】
2017/11/14 PHP
javascript 显示当前系统时间代码
2009/12/28 Javascript
jquery异步调用页面后台方法&amp;#8207;(asp.net)
2011/03/01 Javascript
jQuery 操作option的实现代码
2011/03/03 Javascript
jquery实现树形二级菜单实例代码
2013/11/20 Javascript
解析页面加载与js函数的执行 onload or ready
2013/12/12 Javascript
JS获取select-option-text_value的方法
2013/12/26 Javascript
无限树Jquery插件zTree的常用功能特性总结
2014/09/11 Javascript
JavaScript实现的SHA-1加密算法完整实例
2016/02/02 Javascript
jQuery EasyUI学习教程之datagrid点击列表头排序
2016/07/09 Javascript
又一款js时钟!transform实现时钟效果
2016/08/15 Javascript
js仿搜狐视频记录片列表展示效果
2020/05/30 Javascript
vue的Virtual Dom实现snabbdom解密
2017/05/03 Javascript
python读取html中指定元素生成excle文件示例
2014/04/03 Python
django 自定义用户user模型的三种方法
2014/11/18 Python
深入浅析python定时杀进程
2016/06/06 Python
python移位运算的实现
2019/07/15 Python
Python 格式化打印json数据方法(展开状态)
2020/02/27 Python
python实现人工蜂群算法
2020/09/18 Python
Python reversed反转序列并生成可迭代对象
2020/10/22 Python
python实现三种随机请求头方式
2021/01/05 Python
pycharm Tab键设置成4个空格的操作
2021/02/26 Python
canvas裁剪clip()函数的具体使用
2018/03/01 HTML / CSS
AmazeUI 平滑滚动效果的示例代码
2020/08/20 HTML / CSS
墨西哥购物网站:Elektra
2020/01/21 全球购物
Vector, ArrayList, HashTable, HashMap哪些是线程安全的,哪些不是
2015/10/12 面试题
房屋所有权证明
2014/10/20 职场文书
教师师德师风整改措施
2014/10/24 职场文书
出国留学英文自荐信
2015/03/25 职场文书
红高粱观后感
2015/06/10 职场文书
会议营销主持词
2015/07/03 职场文书
2015初中教导处工作总结
2015/07/21 职场文书
优秀志愿者感言
2015/08/01 职场文书
解读MySQL的客户端和服务端协议
2021/05/10 MySQL