微信浏览器无法下载扫码下载apk问题的解决方案及源码

最近公司开发了一款app，在做推广的时候遇到了微信扫码无法直接下载的问题

　　最终在参考了众多资料后，发现微信内置浏览器不支持直接下载功能，可能这就是公司足够大了，有些功能不给开放也不会怎样。但是问题还是要解决的。

解决办法：

　　一、上传微信开放平台

　1，首先你在QQ开放平台http://open.qq.com注册，创建你的应用，
　2，在你的应用中就可以找到微下载的url，有pc端的,和手机端的，
　3，把pc端的url地址用浏览器打开，然后可以看到立即下载按钮，
　4，通过查看源代码，把这个按钮的下载地址找到，
　5，把这个下载地址生成二维码，用微信扫一扫就可以直接通过浏览器下载了。

　　缺点：　(需要上传到腾讯的应用宝平台，审核就要好几天，后期管理起来的话也比较麻烦，不过这个方法肯定是可以的，毕竟微信和腾讯是一家人。)

　二、做一个网页，指向另一个网页进行下载。这个方法也是比较常见的一个方法。做一个假的页面然后指向我们要下载的apk：

<!DOCTYPE html>
<html lang="zh_CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="renderer" content="webkit">
    <style type="text/css">
     *{margin:0; padding:0;}
     a{text-decoration: none;}
     img{max-width: 100%; height: auto;}
     
    .download{color: #4D4D4D; padding: 7.2% 6.8% 9.3%;}
    .download .entry-hd{font-size: 2.4em; font-weight: bold; text-align: center;}
    .download-btn{padding-top: 9%; text-align: center;}
    .download-btn .android-btn{ width:auto; margin:0 auto;}
    
    .footer-bg{background: #2D2D2D; color: #E4E4E4; padding: 3.4% 2%; text-align: center;}
    .footer-bg .entry-con{font-size: 1em;}
    
    #weixin-tip{display:none; position: fixed; left:0; top:0; background: rgba(0,0,0,0.8); filter:alpha(opacity=80); width: 100%; height:100%; z-index: 100;} 
    #weixin-tip p{text-align: center; margin-top: 10%; padding:0 5%; position: relative;}
    #weixin-tip .close{
        color: #fff;
        padding: 5px;
        font: bold 20px/20px simsun;
        text-shadow: 0 1px 0 #ddd;
        position: absolute;
        top: 0; left: 5%;
    }
    </style>
    <title>青少年法治e站app下载</title>
</head>
<body class="success">
    <div class="page-wrap">
        <div class="download">
            <h3 class="entry-hd">
            </h3>
            <div class="download-btn"><a href="http://路径/xx.apk" class="android-btn" id="J_weixin"><img src="" alt="安卓版下载"></a></div>
        </div>
        <div class="footer-bg">
            <p class="entry-con">注：微信用户请在右上角选择“在浏览器中打开”，再选择下载应用</p>
        </div>
    </div>
    <div id="weixin-tip"><p><img src="可访问到的图片路径.jpg" alt="微信打开"/><span id="close" title="关闭" class="close" style="color:black"   >×请在右上角选择“在浏览器中打开”，再选择下载应用</span></p></div>
    <script type="text/javascript">
    var is_weixin = (function() {
        var ua = navigator.userAgent.toLowerCase();
        if (ua.match(/MicroMessenger/i) == "micromessenger") {
            return true;
        } else {
            return false;
        }
    })();
    window.onload = function(){
        var winHeight = typeof window.innerHeight != 'undefined' ? window.innerHeight : document.documentElement.clientHeight;
        var btn = document.getElementById('J_weixin');
        var tip = document.getElementById('weixin-tip');
        var close = document.getElementById('close');
        if(is_weixin){
            btn.onclick = function(e){
                tip.style.height = winHeight + 'px';
                tip.style.display = 'block';
                return false;
            }
            close.onclick = function(){
                tip.style.display = 'none';
            }
        }
    }
    </script>
</body>
</html>

效果展示：

但是经过仔细寻找发现了一个更好的解决方案：

三：点击链接，自动打开外部浏览器下载APP

微信中点击或打开链接，自动打开外部浏览器下载app。全程完全自动化，无需用户任何手工操作。

这种方案可以说是完美解决微信中下载app的问题。效果如下面这样子：

1、安卓：直接跳转打开下载链接

2、苹果直接跳转 app store

如此一来我们就解决了域名被微信拦截的问题了，那么接下来就可以在微信内大量的分享链接或二维码来进行宣传引流了。如此也能够极大地提高自己的APP在微信中的推广转化率，充分利用微信的用户群体来增加收益。

微信浏览器无法下载扫码下载apk问题的解决方案及源码

猜你喜欢