項目需求:掃碼根據不同平台下載不同版本的APP。主要是ios和Android。
網上找了很多,前面判斷平台的代碼很容易找到,但是后面的就有些坑了。有的人的是根本跑不通。有的是代碼補全。
下面是 微信掃碼下載APP。(iOS版)
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <meta http-equiv="X-UA-Compatible" content="ie=edge"> 7 <title>下載APP</title> 8 </head> 9 <body> 10 11 </body> 12 <script> 13 // 判斷是不是 ios 設備 14 function checkIsAppleDevice() { 15 let u = navigator.userAgent, 16 app = navigator.appVersion; 17 console.log('u======', u); 18 console.log('app=======', app) 19 let ios = !!u.match(/\i[^;]+;( U;)? CPU.+Mac OS X/); 20 let iPad = u.indexOf('iPad') > -1; 21 let iPhone = u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1; 22 if(ios || iPad || iPhone) { 23 return true; 24 } else { 25 return false; 26 } 27 } 28 // alert( checkIsAppleDevice() ) 29 30 // 判斷是不是 Android 設備 31 function checkIsAndroidDevice() { 32 let u = navigator.userAgent; 33 // console.log(u); 34 if(u.indexOf('Android') > -1 || u.indexOf('Adr') > -1 ) { 35 return true; 36 } else { 37 return false; 38 } 39 } 40 41 42 if (checkIsAppleDevice()) { 43 // alert('蘋果手機') 44 window.location.href = 'https://apps.apple.com/us/app/APP的包名/id+ID號?l=zh&ls=1' 45 } else { 46 // alert('安卓手機') 47 // 安卓手機暫時沒跑通,不寫 48 } 49 50 function isWinxin() { 51 var ua = window.userAgent.toLowerCase(); 52 if(ua.match(/MicroMessenger/i) == 'micromessenger') { 53 return true; 54 } else { 55 return false; 56 } 57 } 58 59 // http://www.qianhengnet.com/jeesite/static/download.html 60 61 </script> 62 </html>
將上面的頁面放到服務器上,然后將地址生成一個二維碼,再掃描就可以了。
上面蘋果手機的 鏈接是可以從提交APP的官網獲得的。
獲得 鏈接:
新打開的頁面就是:
這就是代碼中鏈接的由來。
iOS的就可以成功了。安卓的比較麻煩還沒找到好的方法。