一個二維碼如何自動識別是安卓(Android)還是蘋果(IOS)


思考問題:

通常,我們開發一個APP,有Android版本、IOS版本。

但是只有一個二維碼?怎么辦呢?

怎么讓IOS用戶掃描二維碼下載IOS版本,Android用戶掃描二維碼下載到Android版本呢?

 

實現思路:

  1. 首先,需要新建一個html文件,通過JavaScript來判斷用戶的手機系統(IOS或Android),判斷之后,根據不同的手機系統,跳轉到不同的鏈接去下載。
  2. 然后,使用這個html文件的鏈接去生成一個二維碼圖片。
  3. 最后,拿出手機掃一掃二維碼圖片會跳轉到相應的下載鏈接。

 

給出代碼:down.html

 1 <html>
 2 
 3 <head>
 4     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 5     <title>二維碼下載</title>
 6 
 7     <script type="text/javascript">
 8         /*  
 9          * 智能機瀏覽器版本信息:  
10          *  
11          */
12         var browser = {
13             versions: function() {
14                 var u = navigator.userAgent,
15                     app = navigator.appVersion;
16                 return { //移動終端瀏覽器版本信息  
17                     trident: u.indexOf('Trident') > -1, //IE內核  
18                     presto: u.indexOf('Presto') > -1, //opera內核  
19                     webKit: u.indexOf('AppleWebKit') > -1, //蘋果、谷歌內核  
20                     gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐內核  
21                     mobile: !!u.match(/AppleWebKit.*Mobile.*/) || !!u.match(/AppleWebKit/), //是否為移動終端  
22                     ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios終端  
23                     android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android終端或者uc瀏覽器  
24                     iPhone: u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1, //是否為iPhone或者QQHD瀏覽器  
25                     iPad: u.indexOf('iPad') > -1, //是否iPad  
26                     webApp: u.indexOf('Safari') == -1 //是否web應該程序,沒有頭部與底部  
27                 };
28             }(),
29             language: (navigator.browserLanguage || navigator.language).toLowerCase()
30         }
31 
32         if (browser.versions.ios || browser.versions.iPhone || browser.versions.iPad) {
33             window.location = "https://itunes.apple.com/cn/app/xxx";  //改地址放入IOS跳轉鏈接
34         } else if (browser.versions.android) {               //該地址放入Android下載包鏈接
35             window.location = "http://zhj8.aliapp.com/xxx.apk";
36         }
37 
38         //            document.writeln("語言版本: " + browser.language);  
39         //            document.writeln(" 是否為移動終端: " + browser.versions.mobile);  
40         //            document.writeln(" ios終端: " + browser.versions.ios);  
41         //            document.writeln(" android終端: " + browser.versions.android);  
42         //            document.writeln(" 是否為iPhone: " + browser.versions.iPhone);  
43         //            document.writeln(" 是否iPad: " + browser.versions.iPad);  
44         //            document.writeln(navigator.userAgent);
45     </script>
46 </head>
47 
48 <body>
49 
50 </body>
51 
52 </html>

 

用這個down.html去生成一個二維碼圖片,再使用手機掃一掃即可。

 

 

希望能夠幫助到大家!若有問題,歡迎加群!

 


免責聲明!

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



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM