1、产生问题的原因
因为腾讯为了保护自家的利益,只有把APP发布到他们的应用宝上,用他们提供的连接才能用微信进行APP扫描,否则的话用微信扫描APP的二维码一律都屏蔽掉。
2、需要解决的问题
首先识别不同终端扫描,是android手机扫描还是IOS手机扫描,还是iPad扫描,如果是:
2.1 android手机扫描,则进行判断是用微信扫描还是用其它扫描软件扫描,如果是微信扫描则跳出保护层提示用浏览器打开进行下载安装,否则的直接进行
下载安装
2.2 IOS手机扫描,则自动跳到appstore里让用户进行下载
3、识别不同终端手机的代码以及对扫描软件判断:
<!--JSP代码---!>
<!--JSP代码---!>
4、微信扫描跳出保护层让其用浏览器打开代码、
<!--jsp--!>
<!--jsp--!>
因为腾讯为了保护自家的利益,只有把APP发布到他们的应用宝上,用他们提供的连接才能用微信进行APP扫描,否则的话用微信扫描APP的二维码一律都屏蔽掉。
2、需要解决的问题
首先识别不同终端扫描,是android手机扫描还是IOS手机扫描,还是iPad扫描,如果是:
2.1 android手机扫描,则进行判断是用微信扫描还是用其它扫描软件扫描,如果是微信扫描则跳出保护层提示用浏览器打开进行下载安装,否则的直接进行
下载安装
2.2 IOS手机扫描,则自动跳到appstore里让用户进行下载
3、识别不同终端手机的代码以及对扫描软件判断:
<!--JSP代码---!>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport"
content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta charset="utf-8">
<title>手机APP下载页面</title>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
a {
text-decoration: none;
}
img {
max-width: 100%;
height: auto;
}
.weixin-tip {
display: none;
position: fixed;
left: 0;
top: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.8);
filter: alpha(opacity = 80);
height: 100%;
width: 100%;
z-index: 100;
}
.weixin-tip p {
text-align: center;
margin-top: 10%;
padding: 0 5%;
}
</style>
<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.baidufe.com';
if (Terminal.platform.android) {
//theUrl = '你的Android APP对应下载地址:apk文件地址';
var ua = window.navigator.userAgent.toLowerCase();
if(ua.match(/MicroMessenger/i) == 'micromessenger'){
//"发现微信扫描则跳出保护层让其打开浏览器"
theUrl='http://10.10.3.241:8080/TongJiWeiXin/twocodeie.jsp';
}else{
//其它扫描,则不做拦截,让其进行下载
theUrl="http://218.242.153.98/EyeDisease/EyeDisease.apk";
}
} else if (Terminal.platform.iPhone) {
//theUrl = '你的iPhone APP对应下载地址:APP Store地址';
theUrl="http://dynamic.12306.cn/otn/appDownload/download";
} 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>
<!--JSP代码---!>
4、微信扫描跳出保护层让其用浏览器打开代码、
<!--jsp--!>
<!DOCTYPE html>
<html lang="zh_CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
<title>点击下载应用</title>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
a {
text-decoration: none;
}
img {
max-width: 100%;
height: auto;
}
.weixin-tip {
display: none;
position: fixed;
left: 0;
top: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.8);
filter: alpha(opacity = 80);
height: 100%;
width: 100%;
z-index: 100;
}
.weixin-tip p {
text-align: center;
margin-top: 10%;
padding: 0 5%;
}
</style>
</head>
<body>
<div class="weixin-tip">
<p>
<img src="img/live_weixin.png" alt="微信打开" />
</p>
</div>
<script type="text/javascript">
$(window).on("load", function() {
var winHeight = $(window).height();
function is_weixin() {
var ua = navigator.userAgent.toLowerCase();
if (ua.match(/MicroMessenger/i) == "micromessenger") {
return true;
} else {
return false;
}
}
var isWeixin = is_weixin();
if (isWeixin) {
$(".weixin-tip").css("height", winHeight);
$(".weixin-tip").show();
}
})
</script>
<a href="http://218.242.153.98/EyeDisease/EyeDisease.apk" style="font-size: 35px;">APP下载</a>
</body>
</html>
<!--jsp--!>
下面是live_weixin.png图片,下载下来,放入项目中,此文引用了蔡宝鉴博客的部分内容,在此感谢