DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> iOS和Android用同一個二維碼實現跳轉下載鏈接的方法
iOS和Android用同一個二維碼實現跳轉下載鏈接的方法
編輯:關於JavaScript     

前言

最近一個項目需要iOS和安卓使用一個二維碼,讓掃描的機器自己識別操作系統實現跳轉到相應的下載鏈接。比如iPhone用微信進行掃描就讓他跳轉appStore的下載頁面,安卓機器使用微信掃描就直接跳浏覽器下載。但是這二維碼還有一個需求就是,用戶已經下載了這個app,當用戶打開app進入到注冊頁面時,再次掃描這個二維碼時,自動填寫邀請碼進行注冊。那麼該如何實現,細節就不說了,直接上代碼。

使用js實現,其實代碼非常簡單.

使用時直接拷貝代碼,改掉相應的鏈接就好。

PS:該鏈接在微信環境打開時還是需要手動跳轉到手機的浏覽器才能跳到下載頁面,因為微信內的webView比較特別,所以寫了一個alert引導用戶打開浏覽器。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title></title>
</head>
<body>

  <script>

  /**
    出來的鏈接大概是長這樣的
    http://xxxx.cn/243423.html?c=Q23DR32
  */

  // c=Q23DR32是注冊時掃描獲取的邀請碼。
  // 這樣加參數,後面的參數會被自動忽略,不會影響加載此網頁

    goDownload();

    // 去下載
    function goDownload() {
      var u = navigator.userAgent, app = navigator.appVersion;
      var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1;
      var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
      // 是安卓浏覽器
      if (isAndroid) {
        window.location.href = 'http://xxxxxxx.cn/release/xxxx-release.apk'; // 跳安卓端下載地址
      }
      // 是iOS浏覽器
      if (isIOS) {
        window.location.href = 'https://itunes.apple.com/cn/app/xxxxxxx/id1124348115?mt=8'; // 跳AppStore下載地址
      }

      // 是微信內部webView
      if (is_weixn()) {
        alert("請點擊右上角按鈕, 點擊使用浏覽器打開");
      }

      // 是PC端
      if (IsPC()) {
        window.location.href = 'http://www.xxxxxxx.cn/index.html'; // 公司主頁
      }
    }

    // 是微信浏覽器
    function is_weixn(){
      var ua = navigator.userAgent.toLowerCase();
      if(ua.match(/MicroMessenger/i)=="micromessenger") {
        return true;
      } else {
        return false;
      }
    }


    function IsPC() {
      var userAgentInfo = navigator.userAgent;
      var Agents = ["Android", "iPhone",
        "SymbianOS", "Windows Phone",
        "iPad", "iPod"];
      var flag = true;
      for (var v = 0; v < Agents.length; v++) {
        if (userAgentInfo.indexOf(Agents[v]) > 0) {
          flag = false;
          break;
        }
      }
      return flag;
    }

  </script>
</body>
</html>

總結

以上就是iOS和Android用同一個二維碼實現跳轉下載鏈接的方法,大家都學會了嗎,希望本文的內容對大家的學習或者工作能帶來一定的幫助,如果有更好的解決方案或可以通過代碼判斷微信客戶端的系統環境的方法請留言交流。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved