javascript:微信扫一扫下载android应用的引导页

一，js代码:

<html>
<head>
    <meta charset="utf-8"/>
    <title>测试</title>
</head>
<body style="padding:0px;margin: 0px;">
    <!--background-->
    <div style="width:100%;height: 100vh;background: #000000;opacity: 0.5;position: fixed;"></div>
    <div style="width:100%;height: 100vh;position: relative;">
         <img id="arrow" src="wx_arrow.png" style="position: absolute;right:40px;top:20px;" />
         <div id="msg" style="left:10%;color:#ffffff;width:80%;position: absolute;top:36%;font-size: 3rem;">
               点击右上角按钮，选择「在浏览器打开」，会自动开启app下载
         </div>
    </div>
    <script>
        //全局变量
        let globalApk = 'http://static.lhdtest.com/apk/lhdtest_v1.2.3_2022121211_general_release.apk';
        //页面加载完成,如果是微信浏览器，提示跳转到手机浏览器
        //如果不是微信浏览器，则开始下载
        window.onload=function () {
            let isWx = isWeixin();
            if (isWx == true) {
                console.log('当前是微信浏览器');
                document.getElementById('arrow').style.display = "";
                document.getElementById('msg').innerHTML = "点击右上角按钮，选择「在浏览器打开」，会自动开启app下载";
            } else {
                console.log('当前非微信浏览器,跳转到apk');
                document.getElementById('arrow').style.display = "none";
                document.getElementById('msg').innerHTML = "如下载未自动启动，请点击<a style='text-decoration:none;' href='"+globalApk+"'>这里</a>";
                window.location.href = globalApk;
            }
        }

        //判断是否微信浏览器
    function isWeixin() {
      var ua = navigator.userAgent.toLowerCase();
      if (ua.match(/MicroMessenger/i) == "micromessenger") {
        return true;
      } else {
        return false;
      }
    }
    </script>
</body>
</html>

说明：刘宏缔的架构森林是一个专注架构的博客，

网站：https://blog.imgtouch.com
原文: https://blog.imgtouch.com/index.php/2023/06/03/javascript-wei-xin-sao-yi-sao-xia-zai-android-ying-yong-de/

         对应的源码可以访问这里获取： https://github.com/liuhongdi/
         或: https://gitee.com/liuhongdi

说明：作者:刘宏缔 邮箱: 371125307@qq.com

二，测试效果

非微信浏览器:

 

 微信浏览器:

posted @ 2022-12-10 16:22  刘宏缔的架构森林  阅读(282)  评论(0)  编辑  收藏  举报