zoukankan      html  css  js  c++  java
  • js判断移动端是否安装某款app的多种方法

    本文实例讲解了js判断移动端是否安装某款app的多种方法,分享给大家供大家参考,具体内容如下

    第一种方法:

    一:判断是那种设备

    1. var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //android终端或者uc浏览器  
    2. var isiOS = !!u.match(/(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端  

    二:安卓设备:原理:判断是否认识这个协议,认识则直接跳转,不认识就在这里下载app

    1. android();  
    2.   
    3. if(isAndroid){  
    4.       function android(){  
    5.         window.location.href = "openwjtr://com.tyrbl.wjtr"; /***打开app的协议,有安卓同事提供***/  
    6.         window.setTimeout(function(){  
    7.            window.location.href = "http://www.wjtr.com/download/index.html"; /***打开app的协议,有安卓同事提供***/  
    8.         },2000);  
    9.       };  

    二:iOS设备:原理:判断是否认识这个协议,认识则直接跳转,不认识就在这里下载appios();

    1. if(isiOS){  
    2.       function ios(){  
    3.         var ifr = document.createElement("iframe");  
    4.         ifr.src = "openwjtr://com.tyrbl.wjtr"; /***打开app的协议,有ios同事提供***/  
    5.         ifr.style.display = "none";   
    6.         document.body.appendChild(ifr);  
    7.         window.setTimeout(function(){  
    8.           document.body.removeChild(ifr);  
    9.            window.location.href = "http://www.wjtr.com/download/index.html"; /***下载app的地址***/  
    10.         },2000)  
    11.       };  
    12. }  

    第二种方法:

    虽然在Js中可以启动某个app,但是并不能判断该app是否安装;
    启动app需要的时间较长,js中断时间长,如果没安装,js瞬间就执行完毕。直接上代码吧!
    html代码:

    1. <href="javascript:testApp('tel:1868888888')">打电话</a>   

    js代码:

    1. function testApp(url) {   
    2.   var timeout, t = 1000, hasApp = true;   
    3.   setTimeout(function () {   
    4.     if (hasApp) {   
    5.       alert('安装了app');   
    6.     } else {   
    7.       alert('未安装app');   
    8.     }   
    9.     document.body.removeChild(ifr);   
    10.   }, 2000)   
    11.    
    12.   var t1 = Date.now();   
    13.   var ifr = document.createElement("iframe");   
    14.   ifr.setAttribute('src', url);   
    15.   ifr.setAttribute('style', 'display:none');   
    16.   document.body.appendChild(ifr);   
    17.   timeout = setTimeout(function () {   
    18.      var t2 = Date.now();   
    19.      if (!t1 || t2 - t1 < t + 100) {   
    20.        hasApp = false;   
    21.      }   
    22.   }, t);   
    23. }   

    第三种方法:

    最近在做项目的wap版,有个需求就是,先判断手机上是否有我们的APP应用,如果有的话打开应用,没有才跳转到wap页面。 
    wap简单来说就是运行在移动端浏览器上的网站。不管应用在什么地方,总之就是浏览器呗,可以通过JS来判断本地是否有某应用,实现方式实际就是将http协议转为本地软件协议。 
    还是直接贴代码吧。
     如下: 

    1. <script language="javascript">  
    2.  if (navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)) {  
    3.   var loadDateTime = new Date();  
    4.   window.setTimeout(function() {  
    5.    var timeOutDateTime = new Date();  
    6.    if (timeOutDateTime - loadDateTime < 5000) {  
    7.     window.location = "要跳转的页面URL";  
    8.    } else {  
    9.     window.close();  
    10.    }  
    11.   },  
    12.   25);  
    13.   window.location = " apps custom url schemes ";  
    14.  } else if (navigator.userAgent.match(/android/i)) {  
    15.   var state = null;  
    16.   try {  
    17.    state = window.open("apps custom url schemes ", '_blank');  
    18.   } catch(e) {}  
    19.   if (state) {  
    20.    window.close();  
    21.   } else {  
    22.    window.location = "要跳转的页面URL";  
    23.   }  
    24.  }  
    25. </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的多种方法,希望对大家的学习有所帮助。

  • 相关阅读:
    mysql 在orderby和limit混合使用时重复数据问题
    springboot启动类 注解
    redis RDB和AOF两种持久化的区别
    C#解析逻辑字符串【x>y&&a>b||p=r】
    删除例如联想笔记本系统隐藏分区
    通过贝叶斯算法实现自动识别类别
    将可执行exe文件注册成windows服务
    Windows10中的IIS10安装php manager和IIS URL Rewrite 2.0组件的方法
    添加钩子监听全局鼠标或键盘事件
    C# DateTime.Now和DateTime.UtcNow的区别
  • 原文地址:https://www.cnblogs.com/dhcn/p/7124686.html
Copyright © 2011-2022 走看看