<!doctype html>

<html>

<head>

<title></title>

<meta charset="utf-8">

<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no;" name="viewport" />

<script>

    // 检查是否安装app

    function openApp(e){

        var u = window.navigator.userAgent;

        var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //android终端或者uc浏览器

        var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);

        if(isAndroid){

            android();

        }

        if(isiOS){

            ios();

        }

    }

    function android(){

        var _clickTime = new Date().getTime();

        window.location.href = '？？？？？？？？？？？？？？？？？？'; /***打开app的协议，有安卓同事提供***/

            //启动间隔20ms运行的定时器，并检测累计消耗时间是否超过3000ms，超过则结束

        var _count = 0, intHandle;

        intHandle = setInterval(function(){

            _count++;

            var elsTime = new Date().getTime() - _clickTime;

            if (_count>=100 || elsTime > 3000 ) {

                console.log(_count)

                console.log(elsTime)

                clearInterval(intHandle);

                //检查app是否打开

                if ( document.hidden || document.webkitHidden) {

                    // 打开了

                    window.close();

                } else {

                    // 没打开

                    alert('没打开')

                    // window.location.href = "？？？？？？？？？？？？？？";//下载链接

                }

            }

        }, 20);

    }

    function ios(){

        var _clickTime = +(new Date());

        var ifr = document.createElement("iframe");

        ifr.src = "？？？？？？？？？？？？？？"; /***打开app的协议，有ios同事提供***/

        ifr.style.display = "none";

        document.body.appendChild(ifr);

        //启动间隔20ms运行的定时器，并检测累计消耗时间是否超过3000ms，超过则结束

        var _count = 0, intHandle;

        intHandle = setInterval(function(){

            _count++;

            var elsTime =  +(new Date()) - _clickTime;

            console.log(_count,elsTime,+(new Date()),_clickTime)

            if (_count>=100 || elsTime > 3000 ) {

                clearInterval(intHandle);

                document.body.removeChild(ifr);

                //检查app是否打开

                if ( document.hidden || document.webkitHidden) {

                    // 打开了

                    window.close();

                } else {

                    // 没打开

                    alert('没打开')

                    // window.location.href = "？？？？？？？？？？？？？？？";//下载链接

                }

            }

        },20);

    }

    var objbtn=document.getElementById('btn');

    objbtn.onclick=function(){

        openApp()

    }

</script>

</head>

<body style="background-color: #fff;" >

    <!--测试app调起-->

    <div id="btn" style="font-size: 40px;background: blue;color: #fff;height: 56px;text-align: center;">btn</div>

    <!--测试app调起over-->

</body>

</html>　　

重要的是 安装了app打开app，但是 不能让用户在点击确定的时候，跳转到下载页。

　　　　没安装app的用户，不能等待太久，还不到app下载页。

若通过url scheme 打开app成功，那么当前h5会进入后台，通过计时器会有明显延迟。利用时间来判断。

  • 由于安卓手机,页面进入后台，定时器setTimeout仍会不断运行，所以这里使用setInterval,较小间隔时间重复多次。来根据累计时间判断。
  • document.hidden对大于4.4webview支持很好，为页面可见性api。

ios

window.location.href='rtjr://app.rongtuojinrong.com?flag=23&pid={$pid}';

　　js无法调起 这种协议的url

<a  href="rtjr://app.rongtuojinrong.com?flag=23&pid={$pid}" ></a>

　　只能用 a标签，或者 iframe

h5 调起app 如果没安装就跳转下载的更多相关文章

  1. JS open App（未安装就跳转下载页面）

    直接上代码var APPCommon = { downAppURl : "http://**/",//下载APP地址 downWeixin: "http://**&quo ...

  2. Windows 8.1中怎么启用Framework3.5或2.0 （ 一安装就跳到下载 Win8.1自带了Framework）

    Windows 8.1中怎么启用Framework3.5或2.0      ( 一安装就跳到下载 Win8.1自带了Framework): Win+X键 打开   开始菜单 -> 命令提示符(管 ...

  3. h5页面唤起app(iOS和Android),没有安装则跳转下载页面

    浏览器和app没有通信协议,所以h5不知道用户的手机释放安装了app.因此只能是h5去尝试唤起app,若不能唤起,引导用户去下载我们的app. 微信里屏蔽了 schema 协议,如果在微信中打开h5, ...

  4. 安装oracle11g跳不过下载软件更新[INS-30131] 执行安装程序验证所需的初始设置失败

    链接:https://www.jb51.net/article/88944.htm 问题已解决: 解决方法 第一步: 控制面板>所有控制面板项>管理工具>服务>SERVER 启 ...

  5. H5页面中尝试调起APP

    安卓版本5.0以上 IOS版本10.0以上 采用事件触发的方式处理唤醒APP 市面上常见的功能 这种功能现如今应该非常普遍了,淘宝H5,知乎H5等等... 点击后会调起APP或者打开下载页面或者直接进 ...

  6. java版微信公众号支付(H5调微信内置API)

    最近需要做微信公众号支付,网上找了大堆的代码,大多都只说了个原理,自己踩了太多坑,所有的坑,都会再下面的文章中标注,代码我也贴上最全的(叫我雷锋)!!! 第一步:配置支付授权目录 你需要有将你公司的微 ...

  7. Android H5调起原生微信或支付宝支付

    Android H5调起原生微信或支付宝支付 WebView调用原生微信或支付宝回调:其原理就是在shouldOverrideUrlLoading(final WebView view, String ...

  8. 网页调起App之应用实践

    声明:本文由入驻搜狐公众平台的作者撰写,除搜狐官方账号外,观点仅代表作者本人,不代表搜狐立场.举报 新春佳节即将到来,北京的上地&西二旗.望京&国贸.五道口&中关村地区等程序员 ...

  9. 【Android】解决微信调起支付接口没反应，调不起来微信的问题

    原文:[Android]解决微信调起支付接口没反应,调不起来微信的问题 //#前言 吐槽一下,微信支付的sdk真难用,文档混乱,坑不少. 正文:可能引起这种情况的问题 1. 最不能出现的 你的APPI ...

随机推荐

  1. 我的翻译--针对Outernet卫星信号的逆向工程

    前言 Outernet[1]是一家旨在让访问国际互联网更加方便自由的公司,他们使用卫星来广播维基百科或者其他网站.目前,他们的广播主要使用三颗国际海事卫星[3]的L波段[2],使其广播覆盖全球,大多数 ...

  2. Java安装及环境配置

    一.jdk安装及环境配置 1. 下载jdk 去oracle官网下载,这里使用的jdk版本为 有一个需要注意的问题就是7u71后的jdk有两个版本,奇数版本为无BUG版,偶数版包含奇数版全部内容但是有一 ...

  3. 04-Java基础语法【IDEA、方法】

    重要内容记录: 01.IDE介绍 IDE(Integarted Development Environment)是Java集成开发环境,是一种专门用来提高Java开发效率的软件. 免费的IDE:Ecl ...

  4. python面试的100题（18）

    函数 52.python常见的列表推导式? 列表推导式书写形式: [表达式 for 变量 in 列表] 或者 [表达式 for 变量 in 列表 if 条件] 参考地址:https://www.cnb ...

  5. Codeforces Round #621 (Div. 1 + Div. 2)D（最短路，图）

    #define HAVE_STRUCT_TIMESPEC #include<bits/stdc++.h> using namespace std; ]; vector<]; ]; ] ...

  6. anniversary party_hdu1520

    本来以为是一道很简单的提,可以分分钟解决(实际上就是很简单) 然而一直报错,找半天,竟然要多组输入(还是太菜了) 所以每组需要先初始化, 这是一道树形DP的简单题,具体思路就是我选这个上司就不能选他的 ...

  7. CentOS7安装配置Apache、PHP和MySQL

    一.安装Apache sudo yum install httpd 安装成功后,Apache操作命令: systemctl start httpd //启动apache systemctl stop ...

  8. 第四十三篇 入门机器学习——Numpy的基本操作——Fancy Indexing

    No.1. 通过索引快速访问向量中的多个元素 No.2. 用索引对应的元素快速生成一个矩阵 No.3. 通过索引从矩阵中快速获取多个元素 No.4. 获取矩阵中感兴趣的行或感兴趣的列,重新组成矩阵 N ...

  9. count(*)、count(1)、count(column)的区别

    count(*)对行的数目进行计算,包含NULL count(column)对特定的列的值具有的行数进行计算,不包含NULL值. count()还有一种使用方式,count(1)这个用法和count( ...

  10. 微信或QQ屏蔽了我的域名,已经被微信屏蔽的域名如何在微信打开,如何进行微信域名防封?

    微信域名完全防封是绝对不可能的,这是必须明确的,曾经有人打折<不死域名>的概念,它不是不死,是稍微命长一点,在推广上成本更低一下,效果更好一些, 主要的技术原理是利用了腾讯云的域名安全联盟 ...