2. 程式人生 > >在沒有個人/公司網站的情況下，如何利用同一個二維碼自動識別手機系統（Android/IOS）跳轉不同下載頁面

在沒有個人/公司網站的情況下，如何利用同一個二維碼自動識別手機系統（Android/IOS）跳轉不同下載頁面

阿新 • • 發佈：2019-01-05

一、使用場景

開發了一款App，包括iOS及Android版，到了推廣階段，準備生成二維碼讓使用者掃碼下載，那這個二維碼該怎麼生成？iOS及Andorid各自生成一個二維碼讓使用者區分下載？當然這種方式是可行的，但卻增加了使用者的使用成本！那是不是有一種方式可以通過一個二維碼使手機自動下載相應App包？

本文主要講的就是如何在沒有個人/公司網站的情況下，利用同一個二維碼自動識別手機系統（Android/IOS）跳轉不同的下載頁面。

二、解決方案

我們可以編寫一個html網頁，通過js識別當前終端屬性，根據相應終端屬性重定向到相應下載介面。然後將該html網頁上傳至網站，生成該網頁連結的二維碼圖片，使用者掃描二維碼會自動進入對應下載介面。

三、程式碼部分：index.html

<!DOCTYPE HTML>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>美食街 - 廚房菜譜大全</title>
    <script type="text/javascript">
        // 獲取終端的相關資訊
        var Terminal = {
            // 辨別移動終端型別
            platform : function
 
(){
                var u = navigator.userAgent, app = navigator.appVersion;
                return {
                    // android終端或者uc瀏覽器
                    android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1,
                    // 是否為iPhone或者QQHD瀏覽器
                    iPhone: u.indexOf('iPhone'
 
) > -1 ,
                    // 是否iPad
                    iPad: u.indexOf('iPad') > -1
                };
            }(),
            // 辨別移動終端的語言：zh-cn、en-us、ko-kr、ja-jp...
            language : (navigator.browserLanguage || navigator.language).toLowerCase()
        }

        // 根據不同的終端，跳轉到不同的地址
        var theUrl = 'https://itunes.apple.com/app/id1247266869';
        if(Terminal.platform.android){//安卓端
            document.write('抱歉，“美食街 - 廚房菜譜大全”暫時沒有安卓版APP!');
            //theUrl = 'https://itunes.apple.com/app/id1247266869';
            //location.href = theUrl;
        } else {
            if(Terminal.platform.iPhone){//iPhone端
                theUrl = 'https://itunes.apple.com/app/id1247266869';
            }else if(Terminal.platform.iPad){//iPad端
                // 還可以通過language，區分開多國語言版
                switch(Terminal.language){
                    case 'en-us'://iPad英文版APP Store地址
                        theUrl = 'https://itunes.apple.com/app/id1247266869';
                        break;
                    case 'ko-kr'://iPad韓語版APP Store地址
                        theUrl = 'https://itunes.apple.com/app/id1247266869';
                        break;
                    case 'ja-jp'://iPad日文版APP Store地址
                        theUrl = 'https://itunes.apple.com/app/id1247266869';
                        break;
                    default://iPad預設APP Store地址
                        theUrl = 'https://itunes.apple.com/app/id1247266869';
                }
            }

            location.href = theUrl;
        }

    </script>
</head>
<body>
    <!--

    -->
</body>
</html>

在使用的時候將相應連結替換即可

四、製作二維碼

如果沒有個人/公司網站可以上傳上述html網頁檔案，請繼續瀏覽以下內容；如果已經有了相應網站，那麼你可以直接製作相應二維碼了。

五、將網頁檔案上傳至github，配置相關選項實現網頁自動跳轉

  1. 建立一個工程
    Snip20170804_1.png

  2. 填寫相關工程資訊建立工程
    Snip20170804_2.png
  3. 進入工程頁面複製工程的git連結
    Snip20170804_3.png
  4. 利用git工具（本例使用Mac系統下的Tower）clone工程
    Snip20170804_4.png
  5. 進入本地工程資料夾可以看到工程已經被clone下來了，不過目前只有一個初始的說明檔案
    Snip20170804_7.png
  6. 將之前建好的html檔案匯入本地工程資料夾
    Snip20170804_8.png
  7. 進入Tower填寫相關資訊並提交檔案到github庫中
    Snip20170804_9.png
    Snip20170804_10.png
  8. 重新整理github工程網頁可以看到檔案已經提交成功
    Snip20170804_11.png
  9. 點選Settings進入工程設定頁面
    Snip20170804_12.png
  10. 滾動到GitHub Pages項
    Snip20170804_13.png
  11. 選擇分支並儲存
    Snip20170804_14.png
  12. 儲存完後可以看到工程對應的網址連結
    Snip20170804_16.png
  13. 直接在該連結後拼接之前建立的html檔案即可生成最終連結，用最終連結生成的二維碼就可實現自動跳轉的功能了。歡迎大家通過圖中二維碼下載美食街App哦，不過目前只有iOS版。
    Snip20170804_17.png
    根據程式碼部分邏輯：用iOS裝置掃圖中二維碼會跳轉AppStore美食街頁面，用安卓裝置掃則會在頁面上提示暫時沒有安卓版App，用其他裝置掃也會跳轉AppStore頁面。

相關推薦

在沒有個人/公司網站的情況下，如何利用同一個二維碼自動識別手機系統（Android/IOS）跳轉不同下載頁面

一、使用場景 開發了一款App，包括iOS及Android版，到了推廣階段，準備生成二維碼讓使用者掃碼下載，那這個二維碼該怎麼生成？iOS及Andorid各自生成一個二維碼讓使用者區分下載？當然這種方式是可行的，但卻增加了使用者的使用成本！那是不是有一種方式可

在本地沒有安裝Oracle的情況下，使用plsql遠程連接數據庫

打開 語言 遠程連接 mil .com 安裝步驟 net zhs16gbk too 遠程連接數據庫的方式不止一種。這裏主要寫在本地沒有安裝Oracle的情況下，使用plsql可視化工具遠程連接數據庫的方式。 一、前提 　　首先你本地得安裝有plsql工具。具體的安裝步驟就不

在沒有檢視層的情況下，怎樣將前臺資料直接發給邏輯層

怎樣把邏輯層資料直接發給前臺我就不寫了，有興趣的看看我的-----SSH  不經過Contriller------------（字太多懶得打全）的文章，那是後臺直接發到前臺的程式碼部分 我這邊呢因為經理不讓用Controller層所以沒辦法就用的dwr,第一步要配置dw

如何在沒有外網的情況下，通過Centos系統光碟建立yum源，解決rpm包依賴性問題

相信作為Linux系統管理員在安裝rpm包的過程中或多或少都會遇到軟體依賴性。通常我們的解決方法： 1.通過yum工具連線外網上的yum伺服器來安裝，自動幫忙解決軟甲依賴性。 該方法能夠快速解決軟體依賴性問題，但是解決的前提是生產環境中有外光。如果我們的生產環境不允許

沒有臨時變數的情況下，交換兩個值。

兩個變數值的交換，其中用到臨時變數。 temp=a; a=b; b=temp;  如果在沒有臨時變數的情況下，該如何做呢？ 網路上的人們給出了兩種方法： 一、異或法 a=a^b; b=b^a; a=a^b;  二、加減法 a = a+b;   

比較兩個json，key值相同的情況下判斷另一個json的value值是否為空（遞迴）

前言：作為一個Java的初學者，第一個寫部落格，如有不當之處請多多指教。我是在檢驗報文的必輸項的情況下寫的該方法。 import com.alibaba.fastjson.JSONObject; import com.alibaba.fastjson.JSONArray

【踩坑】聯合主鍵情況下，JPA非主鍵設定自動增長無效

開發十年，就只剩下這套架構體系了！ >>>   

使用TCP協議完成Xposed hook個人免籤支付系統，支援qq，微信，支付寶二維碼實時生成

由於之前思路使用natapp對映，但是個人是個比較愛折騰的人，覺得配置域名比較麻煩，於是就大致對整個系統思考了下，準備把APP承擔的服務端職責抽離出來，大致以下倆個思路 1、APP和服務端不進行TCP連結，而是使用一種比較迂迴的方法，作為使用者端不再去請求APP拿二維碼資料

php利用phpqrcode生成二維碼，並將二維碼蓋在一張圖上實現美化

       這兩天在開發一個支付寶授權功能，因為要用到二維碼分享掃描功能，每條記錄都有專屬的二維碼，所以需要生成專屬二維碼並且這個二維碼還得有些引導功能，所以需要將生成的二維碼放在實現準備好的圖片上面。       &nbs

手機線下支付，全面的二維碼防盜支付措施來了，趕緊收藏！

https 使用 密碼 tps 第三方 聚合支付 支持 排隊 平臺 隨著二維碼支付越來越普及，不法分子們也想出了各種各樣的盜刷手段，讓消費者和商家防不勝防。人們現在購物，娛樂，停車，繳費等只需要提供一個手機就能解決，商店付款時提供二維碼或者掃碼就可以，正因為如此，最近就有出

從無人貨架到無人售貨櫃，加了二維碼就叫“新零售”嗎？

無人貨架近日，京東到家宣布，其新一代智能貨櫃——京東到家Go已正式對外運營。預計年底前京東到家Go將會覆蓋包括北上廣深在內的全國10個以上主要城市。隨著京東到家Go的入局，國內無人售貨櫃市場已經聚集了眾多巨頭和創業企業。這個小小的櫃子，似乎要承載企業切入“新零售”風口的重任。但事實上，無人貨架、無人售貨櫃並不

支付寶 支付寶掃描生成的二維碼提示：碼已失效，請重新整理二維碼後重試

問題描述： 開發過程中整合支付寶支付是掃描生成的二維碼提示：二維碼失效？ 1 最近在做支付寶電腦網站支付開發時，使用官方sdk執行後，掃描生成的付款二維碼提示：碼已失效，請重新整理二維碼後重試。 導致這種錯誤的原因是我們使用了正式環境的支付寶APP掃描的沙箱環境下的付款二維碼  解決辦

.net Core 呼叫微信Jsapi介面，H5解析二維碼

專案裡需要用到掃描二維碼，自己實現，不會。 找到了兩種解決方案： 通過reqrcode.js，這是一個前端解析二維碼內容的js庫。如果二維碼比較清晰，用這種效果也不錯 呼叫微信掃一掃功能，這種效果很好。但是除錯介面超級麻煩。 具體實現：前端程式碼（vue）（前端用到 vux） &l

InChat版，僅僅兩個介面實現自己的IM系統（可相容）

　　InChat 一個IM通訊框架 　　一個輕量級、高效率的支援多端(應用與硬體Iot)的非同步網路應用通訊框架。(核心底層Netty)   　　版本目標：完成基本的訊息通訊(僅支援文字訊息)，離線訊息儲存，歷史訊息查詢，一對一聊天、自我聊天、群聊等。 　　你可以使用InC

Vue用router.push（傳參）跳轉頁面，參數改變，跳轉頁面數據不刷新的解決辦法

ren osi pat 出現 響應 router 手機 dep code vue-router同路由$router.push不跳轉一個簡單解決方案 vue-router跳轉一般是這麽寫： goPage(ParentDeptCode2,DeptCode2,hosName,

java支付寶掃碼支付，簡單生成二維碼方法

支付寶掃碼支付 首先申請 appid、app_private_key,publicKey, 直接上程式碼： 方式一：可以禁用支付通道(disable_pay_channels) public static void main(String[] args) thr

android webview網頁上的點選按鈕（事件gotointroducion）跳轉url連結地址無效沒有反應

本來這個是個簡單事情，可就是便便搞了幾個小時，比如，webview載入網頁，裡面有個按鈕點選跳轉到另一個網頁，當點選的時候按鈕是有反應的，但網頁log列印gotointroducion，有點矇蔽，不知道什麼意思？百度也沒有，搜尋了很久。用了很多種方法都沒有解決，最後還是艱難的解決了。 一些j

PHP微信支付--接入支付SDK，生成訂單二維碼進行掃碼支付

在PHP開發微信支付中接入支付SDK，生成訂單二維碼進行掃碼支付，實際運用中做出一些整理，以便後期查閱。整體流程如下圖； 微信支付官方流程：https://pay.weixin.qq.com/wiki/doc/api/native.php?chapter=6_5 1、當我們選擇使用掃碼支付，

android利用zbar二維碼掃描

原始碼下載 之前用zxing做開發，各種奇葩問題，橫屏修等等，而且效能也不搞。被測試批了，沒辦法後來換了zbar。效能好多了。 /*********************重要更新*******************************/ 有朋友提到兩個問題： 1.

使用zxing實現二維碼，並解析二維碼

使用zxing生成二維碼，會比較簡單。很適合初學者學習。 package com.code; import java.io.File; import java.nio.file.Path; import java.util.HashMap; import com