扫描二维码自动识别手机系统（Android/IOS）
移动互联网发展迅速，各种APP的开发都会推出多个版本（多终端），比如：iPhone版、iPad版、Android版。有些APP还会考虑覆盖到多个国家（国际化），比如：中文版、英文版、日文版、韩文版等。此外，针对不同渠道（流量来源）也会提供不同的版本（多渠道），比如：百度版、Google版、阿里版、腾讯版等。
对于应用提供方，希望入口只有一个：扫描二维码直接下载。怎样让这张二维码承载这么丰富的信息量，让不同终端、不同国家、来自不同渠道的用户扫描同一个二维码能下载到对应的APP客户端呢？
这里参照Specs网友撰写的解决方案，做一个跳转页面（可以是最简单的HTML静态页面），所有逻辑控制都在该页面进行，比如判断终端、判断语言、判断渠道等，然后通过该页面URL生成一张二维码即可！
一、针对“多终端适配”&“APP国际化”
<!DOCTYPE HTML>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>手机APP下载页面：根据终端辨别下载地址</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 = 'http://www.XXX.com';
if(Terminal.platform.android){
theUrl = '你的Android APP对应下载地址：apk文件地址';
}else if(Terminal.platform.iPhone){
theUrl = '你的iPhone APP对应下载地址：APP Store地址';
}else if(Terminal.platform.iPad){
// 还可以通过language，区分开多国语言版
switch(Terminal.language){
case 'en-us':
theUrl = '你的iPad APP（英文版）对应下载地址：APP Store地址';
break;
case 'ko-kr':
theUrl = '你的iPad APP（韩语版）对应下载地址：APP Store地址';
break;
case 'ja-jp':
theUrl = '你的iPad APP（日文版）对应下载地址：APP Store地址';
break;
default:
theUrl = '你的iPad APP（中文版-默认）对应下载地址：APP Store地址';
}
} location.href = theUrl;
</script>
</head>
<body>
<!-- -->
</body>
</html>
假设如上网页文件对应的URL为：http://www.XXX.com/app-install/terminal-language.html
那么就可以通过该URL生成一张二维码，扫描该二维码后，不同终端、语言版本具体的下载地址，由terminal-language.html自动识别并跳转。
二、针对“多渠道适配”
<!DOCTYPE HTML>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>手机APP下载页面：根据渠道辨别下载地址</title>
<script type="text/javascript"> // 如果要分渠道，也是可以的，渠道区分：?from=xx
var From = (function(){
var searchInfo = location.search.substr(1).split('&'),item,from;
for(var i= 0,len=searchInfo.length;len > 1 && i<len;i++){
item = searchInfo[i].split('=');
if(item[0] == 'from') {
from = item[1];
break;
}
}
return from;
})(); // 根据不同渠道，去向不同的下载地址
var theUrl = 'http://www.XXX.com';
switch(From){
case 'baidu':
theUrl = '你的APP：针对 baidu 的定制版';
break;
case 'google':
theUrl = '你的APP：针对 google 的定制版';
break;
default:
theUrl = '你的APP：官方 版';
break;
}
location.href = theUrl; </script>
</head>
<body>
<!-- -->
</body>
</html>
对于上面这种多渠道适配的，会稍微复杂一些，假设上面网页文件的URL地址为：http://www.XXX.com/app-install/channel.html
那么对于不同的渠道，就需要生成不同的二维码。
假设APP官网（推广页面）为：http://www.baidu.com/app，那么运营PM可能会将该URL后面加上不同参数，然后在各大网站进行推广，比如：
在百度贴吧推广：http://www.XXX.com/app?from=baidu
在新浪微博推广：http://www.XXX.com/app?from=sina
在腾讯微博推广：http://www.XXX.com/app?from=qq
上面的from参数，就是渠道，针对上面的三个渠道，咱们就需要用如下三个URL来生成二维码：
来源网站为百度：http://www.XXX.com/app-install/channel.html?from=baidu
来源网站为新浪：http://www.XXX.com/app-install/channel.html?from=sina
来源网站为腾讯：http://www.XXX.com/app-install/channel.html?from=qq
并且需要在APP官网（http://www.XXX.com/app）显示二维码的地方，通过from参数加载不同渠道的二维码，这样，扫描该二维码后，便会得到该渠道定制版本的APP。
三、三种结合起来，同时对终端、语言、渠道进行识别：
<!DOCTYPE HTML>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>手机APP下载页面：根据终端&渠道辨别下载地址</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()
} // 如果要分渠道，也是可以的，渠道区分：?from=xx
var From = (function(){
var searchInfo = location.search.substr(1).split('&'),item,from;
for(var i= 0,len=searchInfo.length;len > 1 && i<len;i++){
item = searchInfo[i].split('=');
if(item[0] == 'from') {
from = item[1];
break;
}
}
return from;
})(); // 根据不同的终端，跳转到不同的地址
var theUrl = 'http://www.XXX.com';
// android系统APP
if(Terminal.platform.android){
// 这里区分渠道
switch(From){
case 'baidu':
theUrl = '你的APP：baidu定制版';
break;
case 'google':
theUrl = '你的APP：google定制版';
break;
default:
theUrl = '你的APP：官方版'
}
} location.href = theUrl;
</script>
</head>
<body>
<!-- -->
</body>
</html>
扫描二维码自动识别手机系统（Android/IOS）的更多相关文章
- 微信中扫描二维码自动打开手机系统默认浏览器下载APP(APK)
很多朋友问我怎么解决微信内点击链接或扫描二维码可以直接跳出微信在外部浏览器打开网页链接,其实这并不难,只要我们实现微信跳转功能即可.下面给大家介绍这个功能 功能目的 生成微信跳转链接,实现微信内置浏览 ...
- 实现手机扫描二维码页面登录，类似web微信-第二篇，关于二维码的自动生成
转自:http://www.cnblogs.com/fengyun99/p/3541251.html 接上一章,我们已经基本把业务逻辑分析清楚了 下面我们第一步,实现二维码的web动态生成. 页面的二 ...
- Android实例-实现扫描二维码并生成二维码(XE8+小米5)
相关资料: 第三方资料太大没法写在博文上,请下载CSDN的程序包. 程序包下载: http://download.csdn.net/detail/zhujianqiangqq/9657186 注意事项 ...
- 手机扫描二维码下载APP，根据操作系统不同自动下载
Android和IOS手机扫描二维码下载APP,根据OS不同,自动处理相应下载操作.IOS自动跳转至AppStore应用下载页,Android自动下载应用的apk包. <script type= ...
- uni-app开发经验分享十三：实现手机扫描二维码并跳转全过程
最近使用 uni-app 开发 app ,需要实现一个调起手机摄像头扫描二维码功能,官网API文档给出了这样一个demo: // 允许从相机和相册扫码 uni.scanCode({ success: ...
- 实现手机扫描二维码页面登录，类似web微信-第一篇，业务分析
转自:http://www.cnblogs.com/fengyun99/p/3541249.html 关于XMPP组件的文章,先休息两天,好歹已经完整的写了一份. 这两天,先实现一套关于web微信扫描 ...
- Android开发——通过扫描二维码，打开或者下载Android应用
Android开发——通过扫描二维码,打开或者下载Android应用 在实现这个功能的时候,被不同的浏览器折磨的胃疼,最后实现了勉强能用,也查考了一下其他人的博客 android实现通过浏览器点击 ...
- Android进阶笔记06：Android 实现扫描二维码实现网页登录
一. 扫描二维码登录的实现机制: 详细流程图: (1)PC端打开网页(显示出二维码),这时候会保存对应的randnumber(比如:12345678). (2)Android客户端扫码登录,Andro ...
- Android扫描二维码 实现 登录网页
工程代码:ScanQRcode.zip ------------------------------------------------------------------ 1. 扫描二维码登录的实现 ...
随机推荐
- flash2x、flax
http://flax.so/ 牛客网 LeetCode Online Judge
- poj1741 （点分治）
Problem Tree 题目大意 给一棵树,有边权.求树上距离小于等于K的点对有多少. 解题分析 点分治.对每一棵子树进行dfs,求出每棵子树的重心,继而转化为子问题. 对于经过根的路径i--j,令 ...
- JDK和IDE
IDE 集成开发环境(IDE,Integrated Development Environment )是用于提供程序开发环境的应用程序,一般包括代码编辑器.编译器.调试器和图形用户界面工具.集成了代码 ...
- JMS总结
一 什么是JMS 1.JMS,Java Message Service,Java消息服务是一种可以实现异步通讯的消息中间件MOM(Message Oriented Middleware,面向消息的中间 ...
- 黑马----面向方面编程AOP
黑马程序员:Java培训.Android培训.iOS培训..Net培训 JAVA反射-面向方面编程AOP 一.面向方面的需求 有如下模型: 需要统计客户登录时间.使用系统情况,或系统运行日记等信息时, ...
- （转）appendChild()、insertBefore()是移动element节点！
原文地址 appendChild().insertBefore()是移动element节点,看书的时候注意过,也可以做一个简单的例子测试一下: <div id="div1"& ...
- C++中的异常处理机制
C++中的捕获异常机制catch参数中实参的类型不同,采取的处理方式则不相同,且与普通的函数调用还不一样,具体表现为当抛出异常throw A()或throw obj时,对象会进行一次额外的对象复制操作 ...
- supervisord 小记
此篇仅用作supervisord的用法,不涉及理论说明和基础介绍 supervisor(一)基础篇 使用supervisord来管理process 进程的守护神 - Supervisor superv ...
- CNN 逐层可视化 Ipython Notebook
http://nbviewer.ipython.org/github/BVLC/caffe/blob/master/examples/00-classification.ipynb
- fail to create java virtual machine..
今天打开zend stdio 的时候 出现的错误 fail to create java virtual machine... 然后找度娘了,,都说改xxxxx, 我打开360 ,把内存清理了一遍 ...