h5 唤起 app(ios，and)，没下载则跳转下载链接

最新推荐文章于 2024-04-28 18:27:00 发布

pspxuan

最新推荐文章于 2024-04-28 18:27:00 发布

阅读量796

点赞数 1

分类专栏： html h5 JS 文章标签： iOS App唤醒用户检测 App Store navigator.userAgent

本文链接：https://blog.csdn.net/pspxuan/article/details/113686375

版权

JS 同时被 3 个专栏收录

28 篇文章 0 订阅

订阅专栏

html

8 篇文章 0 订阅

订阅专栏

3 篇文章 0 订阅

订阅专栏

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>
    <meta charset="utf-8">
    <title>唤醒app</title>
    <div id="btn"
        style="font-size: 2.2rem;margin: 300px auto;display: block;color: #ffffff;width: 300px;height: 100px;line-height: 100px;background: rgb(213, 0, 9);text-align: center;border-radius: 15px;">
        点击打开</div>
</head>

<body>

    <script>
    	
 function detectVersion() {
          let isAndroid,isIOS,isIOS9,version,
              u = navigator.userAgent,
              ua = u.toLowerCase();

          if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) {   //android终端或者uc浏览器
              //Android系统
              isAndroid = true
          }

          if(ua.indexOf("like mac os x") > 0){
              //ios
              var regStr_saf = /os [\d._]*/gi ;
              var verinfo = ua.match(regStr_saf) ;
              version = (verinfo+"").replace(/[^0-9|_.]/ig,"").replace(/_/ig,".");
          }
          var version_str = version+"";
          if(version_str != "undefined" && version_str.length >0){
              version = parseInt(version)
              if(version>=8){
                  // ios9以上
                  isIOS9 = true
              }
              else{
                  isIOS = true
              }
          }
          return {isAndroid,isIOS,isIOS9}
        }

        // 判断手机上是否安装了app，如果安装直接打开url，如果没安装，执行callback
        function openApp(url,callback) {
            let {isAndroid,isIOS,isIOS9} = detectVersion()
            if(isAndroid || isIOS){
                var timeout, t = 4000, hasApp = true;  
                var openScript = setTimeout(function () {  
                    if (!hasApp) {
                        callback && callback()
                    }
                    document.body.removeChild(ifr);  
                }, 5000)  
                
                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 (t2 - t1 < t + 100) {  
                        hasApp = false;
                    }
                }, t);
            }

            if(isIOS9){
                location.href = url;
                setTimeout(function() {   
                    callback && callback()
                }, 250);
                setTimeout(function() {
                    location.reload();
                }, 1000);
            }  
        }
        
        const btnNode = document.getElementById('btn')
        btnNode.addEventListener('click', () => {
        // 跳转 iosApp
        		openApp("bangbianli://www.zksr.cn?username=IM/czpDurUmGkRUIqvEh/g==",goConfirmAddr)
        })
        // 跳转下载
        function goConfirmAddr(){
            window.location.href = 'https://apps.apple.com/cn/app/%E5%B8%AE%E4%BE%BF%E5%88%A9/id1276118453'
        }

    </script>
</body>

</html>

pspxuan

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
h5 唤起 app(ios，and)，没下载则跳转下载链接

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head> <meta charset="utf-8"> <title>唤醒app</title> <div id="btn" style="font-size: 2.
复制链接

扫一扫

专栏目录