碼上歡樂
相關內容    簡體    繁體

微信掃一掃下載apk解決方案

本文轉載自   查看原文   2015-01-27 15:56   6802 

通過微信的掃一掃去下載，會出現白屏的情況，可能是因為安全性的考慮或者其他什么原因，目前已經無法通過微信的掃一掃去下載apk了。

根據網友們提供的思路，本文整理了兩種方案。

1、申請騰訊開放平台開發者

具體流程可以去訪問http://open.qq.com/，大概的意思是需要將apk提交到騰訊開放平台的里面，每個apk應該會自動生成一個二維碼，每年支付一定的費用，然后在微信里面掃一下這個二維碼，這個時候也需要先安裝一個手機應用寶，才能進行 apk的安裝。

對於這種方案，只能用一種很流行的話說:”很任性”。

2、重定向

這種方法對於一些已經發布出去的二維碼比較有用，也是目前比較普遍的做法。不可能因為微信不能直接下載了，就得把所有的已經流出去的二維碼重新生成吧？

2.1 判斷瀏覽器類型

/*首先判斷是否是pc，若是pc訪問則跳轉到http://app.ctrip.com/*/
    var u = navigator.userAgent || '';
    var isPC = !/(iphone|ios|android|mini|mobile|mobi|Nokia|Symbian|iPod|iPad|Windows\s+Phone|MQQBrowser|wp7|wp8|UCBrowser7|UCWEB|360\s+Aphone\s+Browser)/i.test(u);
    if (isPC) { location.href = "http://www.hipermart.com.cn"; }

如果是pc端的話，那么直接重定向到一個網站

如果是非pc端的話，那么要區分是android還是apple?

2.2 判斷是android還是iOS?

因為我們假設iOS的下載必須從蘋果的appstore里面下載，那么其下載地址有一定的規律，比如說sourceid等。

可以通過一個正則表達式來確定。

var urls = document.location.search, re2 = new RegExp("(\\\?|&)sourceid=([^&]+)(&|$)", "i"), from = urls.match(re2);
    if (from) { sid = from[2]; }

document.location.search

比如一個URL是XXXX?g=1,那么document.location.search的值就是?g=1

2.3 重定向到下載地址

window.onload = function () { //修復圖片偶爾不能加載
        var salesLocal = localStorage.getItem("SALESOBJ") ? JSON.parse(localStorage.getItem("SALESOBJ")) : null;
        var appUrl = salesLocal && salesLocal.data && salesLocal.data.appurl ? salesLocal.data.appurl : "";
        if (!isPC && !iswx) {
            if(appUrl){
                location.href = appUrl;
            }else if(sid){
                location.href = "/m/" + sid;
            }
        }
    }

 

2.4 html頁面源文件

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>下載海瑪特客戶端</title>
    <meta name="viewport" content="width=320.1, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta content="telephone=no" name="format-detection" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <!--link href="css/main.css" rel="stylesheet" type="text/css"-->
    <style type="text/css">
        body {height: 100%;}
        .container {padding:0 20px;background-image: url(images/bg.jpg);background-position: center center;background-size: 100% 100%;height: 100%;}

        .dl-step {padding-top: 58px;}
        .dl-step .step {clear: both;}
        .dl-step .index {float: left;height: 36px;width: 36px;border: 2px solid #fff;background-color: #ffba26;border-radius: 50%;text-align: center;line-height: 36px;position: relative;background-clip: padding-box;color: #fff;}
        .dl-step .content {margin-left: 70px;border-radius: 4px;padding:8px 13px 13px;position: relative;}

        .dl-step-1 {margin-bottom: 60px;position: relative;}
        .dl-step-1 .content {background-color: #ffba26;box-shadow: 0 1px 2px rgba(0,0,0,0.5);font-size: 15px;color: #fff;padding: 0 13px;height: 38px;line-height: 38px;}
        .dl-step-1:before {
            content: "";
            display: block;
            width: 89px;
            height: 75px;
            position: absolute;
            right: 0;
            top: -56px;
            background-image: url(images/icons.png);
            background-size: auto 213px;
            background-repeat: no-repeat;
            background-position: 0 0;
            z-index: 10;
        }
        .dl-step-1 .index:before {
            content: "";
            display: block;
            height: 45px;
            width: 2px;
            background-color: #fff;
            position: absolute;
            top: 45px;
            left: 17px;
            border-radius: 2px;
        }
  
        .dl-step-2 {margin-bottom: 58px;}
        .dl-step-2 .index, .dl-step-3 .index {background-color: rgba(39,41,57,0.2);}
        .dl-step-2 .content, .dl-step-3 .content {background-color: rgba(255,255,255,0.9);box-shadow: 0 1px 2px rgba(0,0,0,0.3);}
        .dl-step-2 .content .tip, .dl-step-3 .content .tip {margin-bottom: 2px;font-size: 15px;color: #333;font-family: Microsoft Yahei;}

        .dl-step-2 .index:before {
            content: "";
            display: block;
            height: 128px;
            width: 2px;
            background-color: #fff;
            position: absolute;
            top: 45px;
            left: 17px;
            border-radius: 2px;
        }

        .dl-devices {overflow: hidden;}
        .dl-devices .item {background-color: #ceecfb;width: 49%;float: left;padding: 5px 0;}
        .dl-devices .android {margin-left: 1px;}
        .dl-devices .name {float: left;background-color: #fff;padding: 0 4px;color: #666;line-height: 14px;font-size: 12px;font-family: Microsoft Yahei;}
        .dl-devices .icon {height: 40px;clear: left;background-image: url(images/icons1.png);background-size: auto 213px;background-repeat: no-repeat;}
        .dl-devices .desc {color:#666;font-size: 10px;text-align: center;font-family: Microsoft Yahei;}
        .dl-devices .ios .icon {background-position: center -85px;}
        .dl-devices .android .icon {background-position: center -131px;}

        .dl-step-3 .app {background-color: #ceecfb;padding: 8px 25px;}
        .dl-step-3 .app .icon {padding-left: 38px;height:31px;line-height:31px;background-image: url(images/icons2.png);background-repeat: no-repeat;background-position: -29px -182px;background-size: auto 213px;font-size: 10px;color: #666;font-family: Microsoft Yahei;}

        .dl-step .content:before {
            content: "";
            display: block;
            height: 0;
            width: 0;
            border: 5px solid transparent;
            border-right-color: rgba(0,0,0,0.1);
            position: absolute;
            top: 14px;
            left: -11px;
        }
        .dl-step .content:after {
            content: "";
            display: block;
            height: 0;
            width: 0;
            border: 5px solid transparent;
            position: absolute;
            top: 13px;
            left: -10px;
        }
        .dl-step-1 .content:after {border-right-color: #ffba26;}
        .dl-step-2 .content:after, .dl-step-3 .content:after {border-right-color: rgba(255,255,255,0.9);}

    </style>
    <script>
    /*首先判斷是否是pc，若是pc訪問則跳轉到http://app.ctrip.com/*/
    var u = navigator.userAgent || '';
    var isPC = !/(iphone|ios|android|mini|mobile|mobi|Nokia|Symbian|iPod|iPad|Windows\s+Phone|MQQBrowser|wp7|wp8|UCBrowser7|UCWEB|360\s+Aphone\s+Browser)/i.test(u);
    if (isPC) { location.href = "http://www.hipermart.com.cn"; }
    </script>
    <script src="js/require.min.js"></script>
    <!--script type="text/javascript">
        var libs = 'libs_r_3.js';
        if (!('__proto__' in {})) {
            libs = 'libs_jq_r_1.1.js';
        }
        document.write('<script type="text/javascript" src="js/' + libs + '"></' + 'script>');
    </script-->
    <!--script src="js/m.ctrip.com.core.min.js"></script-->
    <script>
        var isPC = false;
        var e = navigator.userAgent ? navigator.userAgent.toLowerCase() : '';
        var iswx = /micromessenger/.test(e) ? !0 : !1;
        var wxurl = '';
        if (iswx) {
        wxurl = "http://mp.weixin.qq.com/mp/redirect?url=";
        }
    //    window.onload = function () { //修復圖片偶爾不能加載
        function hello() { //修復圖片偶爾不能加載
        var appUrl = "http://app.hipermart.com.cn:8888/apk/hipermart.apk";
        
        if (!isPC && !iswx) {
            if(appUrl){
            location.href = appUrl;
            }else if(sid){
            location.href = "/m/" + sid;
            }
        }
        }
    </script>

</head>
<body onload="hello()">
    <div class="container">
        <div class="dl-step">
            <div class="step dl-step-1">
                <div class="index">1</div>
                <div class="content">點擊右上方</div>
            </div>
            <div class="step dl-step-2">
                <div class="index">2</div>
                <div class="content">
                    <p class="tip">選擇在瀏覽器中打開</p>
                    <div class="dl-devices">
                        <!--div class="item ios">
                            <span class="name">iOS</span>
                            <div class="icon"></div>
                            <p class="desc">在Safari中打開</p>
                        </div-->
                        <div class="item android">
                            <span class="name">安卓</span>
                            <div class="icon"></div>
                            <p class="desc">在瀏覽器中打開</p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="step dl-step-3">
                <div class="index">3</div>
                <div class="content">
                    <p class="tip">即可自動下載APP</p>
                    <div class="app">
                        <div class="icon">海瑪特客戶端</div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</body>
</html>


免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。



猜您在找 微信掃碼下載apk快速解決方案，中間頁引導法 掃二維碼下載apk並統計被掃描次數(及微信屏蔽下載解決方案) 關於微信掃一掃使用引導頁下載的做法 前端調用微信掃一掃 調用微信掃一掃接口 微信掃一掃接口的調用 vue調起微信掃一掃 php 微信調用掃一掃 java調用微信掃一掃 微信掃碼下載apk
 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM