zoukankan      html  css  js  c++  java
  • 关于H5唤醒APP的功能实现(转载)

     

    原文 https://blog.csdn.net/sinat_29194935/article/details/70820398

          首先,我是个后端,写java的,甚至不是搞移动端的,所以js这方面有点底子但不专业,对于出现的错误也请见谅,原来项目要求有个H5页面打开APP的功能就强行要做,没办法就想办法搞一下,网上的教程基本都是差不多套路,APP厂商也没有提供启动的接口之类的,只能从系统注册表考虑启动应用,所以这下面的代码都是基于你知道这个app的scheme_url和scheme_hosts是啥的基础上进行的。对于不知道这两个地址的只能说:度娘找你。

          并不一定保证百分百打开,只能设置定时器去等应用启动,如果终端反应慢一拍,6秒过了还没启动,代码就认为没应用,会跳转到下载页面去下载。当然安卓稍微容易一些,IOS就比较封闭了。啥话不说,先上js代码

    //启动app方法
    function startApp(url, url2) {
        //url是跳转的scheme地址,这个建议下个反编译的软件,去第三方apk查他们设置的scheme_url和scheme_host是什么,我就是这样干的
        //url2是应用下载地址,要分清ios和android的不一样
        //将下载地址保存到全局变量
        downloadUrl = url2;
        if (ua.match(/ipad|iphone|ipod|ios/i)) {
            //外部一个定时器,专门盯着启动app的定时器loop;就叫它killer吧
            //计时6秒,之后干掉loop.
            window.setTimeout(function() {
                $('#message').html('');
                $('.result-message').eq(0).css("display", "none");
                clearTimeout(loop);
                time = parseInt('6000') / 1000;
            },
            6000);
            //尝试启动应用
            location.href = url;
            //同时开始应用启动倒计时
            countDown();
    
        } else {
            //安卓的就是用iframe来测试是否安装和启动应用了
            window.setTimeout(function() {
                $('#message').html('');
                $('.result-message').eq(0).css("display", "none");
                clearTimeout(loop);
                time = parseInt('6000') / 1000;
            },
            6000);
            //创建iframe并启动应用入口
            openApp(url);
    
        }
    
    }
    
    function openApp(src) {
        // 通过iframe的方式试图打开APP,如果能正常打开,会直接切换到APP
        var ifr = document.createElement('iframe');
        ifr.src = src;
        ifr.style.display = 'none';
        document.body.appendChild(ifr);
        //切换到iframe时
        //此时,会有个问题,如后切换到应用时间小于killer所需要杀死loop的时间,loop就会跳到下载提示,killer`就失去作用了
        countDown();
        window.setTimeout(function() {
            document.body.removeChild(ifr);
        },
        5000);
        //倒计时
    }
    
    function countDown() {
        //每秒调用一次
        loop = window.setTimeout('countDown()', 1000);
        if (time > 0) {
            $('.result-message').eq(0).css("display", "block");
            $('#message').html('正在尝试打开客户端 ' + time + 's');
    
            time--;
            if (time == 0) {
                /*if(ua.match(/ipad|iphone|ipod|ios/i)){
    						console.log(downloadUrl);
    						location.href = downloadUrl;
    					}*/
                //如果计时到0,loop任然没被干掉,就说明应用没有启动,此时,跳到下载提示界面
                //定时器的局限性还是很大,不能响应式反应,所以只能做到这一步了
                $('#message').html('');
                $('.result-message').eq(0).css("display", "none");
                clearTimeout(loop);
                time = parseInt('6000') / 1000;
                var btnArray = ['否', '是'];
                mui.confirm('您没有安装该应用,是否下载安装包?', '应用下载', btnArray,
                function(e) {
                    if (e.index == 1) {
                        location.replace(downloadUrl);
                    } else {
                        return;
                    }
                });
            }
        }
    }
    //url2是应用下载地址,要分清ios和android的不一样
    //将下载地址保存到全局变量
    downloadUrl = url2;
    if (ua.match(/ipad|iphone|ipod|ios/i)) {
        //外部一个定时器,专门盯着启动app的定时器loop;就叫它killer吧
        //计时6秒,之后干掉loop.
        window.setTimeout(function() {
            $('#message').html('');
            $('.result-message').eq(0).css("display", "none");
            clearTimeout(loop);
            time = parseInt('6000') / 1000;
        },
        6000);
        //尝试启动应用
        location.href = url;
        //同时开始应用启动倒计时
        countDown();
    
    } else {
        //安卓的就是用iframe来测试是否安装和启动应用了
        window.setTimeout(function() {
            $('#message').html('');
            $('.result-message').eq(0).css("display", "none");
            clearTimeout(loop);
            time = parseInt('6000') / 1000;
        },
        6000);
        //创建iframe并启动应用入口
        openApp(url);
    
    }
    
    }
    
    function openApp(src) {
        // 通过iframe的方式试图打开APP,如果能正常打开,会直接切换到APP
        var ifr = document.createElement('iframe');
        ifr.src = src;
        ifr.style.display = 'none';
        document.body.appendChild(ifr);
        //切换到iframe时
        //此时,会有个问题,如后切换到应用时间小于killer所需要杀死loop的时间,loop就会跳到下载提示,killer`就失去作用了
        countDown();
        window.setTimeout(function() {
            document.body.removeChild(ifr);
        },
        5000);
        //倒计时
    }
    
    function countDown() {
        //每秒调用一次
        loop = window.setTimeout('countDown()', 1000);
        if (time > 0) {
            $('.result-message').eq(0).css("display", "block");
            $('#message').html('正在尝试打开客户端 ' + time + 's');
    
            time--;
            if (time == 0) {
                /*if(ua.match(/ipad|iphone|ipod|ios/i)){
    						console.log(downloadUrl);
    						location.href = downloadUrl;
    					}*/
                //如果计时到0,loop任然没被干掉,就说明应用没有启动,此时,跳到下载提示界面
                //定时器的局限性还是很大,不能响应式反应,所以只能做到这一步了
                $('#message').html('');
                $('.result-message').eq(0).css("display", "none");
                clearTimeout(loop);
                time = parseInt('6000') / 1000;
                var btnArray = ['否', '是'];
                mui.confirm('您没有安装该应用,是否下载安装包?', '应用下载', btnArray,
                function(e) {
                    if (e.index == 1) {
                        location.replace(downloadUrl);
                    } else {
                        return;
                    }
                });
            }
        }
    }
  • 相关阅读:
    [COM/ATL]组件、对象、MFC、ATL的区别
    中国还是和AMD走到一起了 但美国会高兴吗(网易科技 卢鑫)
    趋势安全云
    统计应收与实收,有发票和商品两种方法,各有优缺点
    雷军:风口论一直被误读 我不是机会主义者
    Jira 6.0.5环境搭建
    逻辑推理能力
    交换变量值的5种方法
    .net下简单快捷的数值高低位切换
    easyui tree 的数据格式转换
  • 原文地址:https://www.cnblogs.com/wang-sai-sai/p/11038150.html
Copyright © 2011-2022 走看看