你的位置:首页 > Java教程

[Java教程]微信浏览器禁止app下载链接的两种处理方法

最近替朋友放一个微信下载链接,通过二维码扫描下载。

通过扫描二维码下载APP已成为一个非常方便的方式,微信也成为扫描二维码重要的工具,但是扫描后微信浏览器会对APK和appStore的链接进行屏蔽,导致用户无法正常下载。

提供解决方案:1.使用腾讯应用宝;2.提示用户使用浏览器打开。

参考了前端开发博客的一篇文章以及进行了改动。采用方案:弹出一个遮罩提示用户在新的浏览器窗口打开。原文链接:http://caibaojian.com/weixin-tip.html

再也不用管微信如何的更新,直接判断微信的ua,然后弹出一个遮罩提示用户在浏览器中打开下载。并且不加关闭的按钮。类似于下面这样子:

微信打开网址添加在浏览器中打开提示

这样子用户就只能在浏览器中打开,并且可以直接下载应用了。欢迎打开微信扫描查看(其他扫描没有效果)。

演示:

微信打开网址添加在浏览器中打开提示

作者已经将代码上传到github上了,你可以直接下载我的图片和JS来用。github地址

如果这个代码对你有用,希望你在下载时也点击star一下。

版本一:纯js。

版本二:纯jQuery。

版本三:jquery+css+div(虽然操作复杂,但实际上平时常用这种)。

如果你已经将它用在你的项目中了,欢迎留下你的在线地址哦。

另加一个判断手机QQ的UA

function is_mobileQQ() {var ua = navigator.userAgent.toLowerCase();if (ua.match(/\sQQ/i) == " qq" && /iphone/i.test(ua) == false) {return true;} else {return false;}}

<!DOCTYPE html><html lang="en"><head>  <meta charset="UTF-8">  <meta name="viewport" content="width=device-width, initial-scale=1"/>  <title>微信弹出遮罩</title></head><body>  <style type="text/css">  *{margin:0; padding:0;}  img{max-width: 100%; height: auto;}  .test{height: 600px; max-width: 600px; font-size: 40px;}  </style>  <div class="test"><a href="http://mp.weixin.qq.com/mp/redirect?url=http://mobile.xinlianwang.com/android/distributor/DistributorApp.apk#weixin.qq.com#wechat_redirect ">有效跳转</a></div>  <script type="text/javascript" src="http://libs.useso.com/js/jquery/1.9.0/jquery.min.js"></script>  <script type="text/javascript">    function is_weixin() {      var ua = navigator.userAgent.toLowerCase();      if (ua.match(/MicroMessenger/i) == "micromessenger") {        return true;      } else {        return false;      }    }    var isWeixin = is_weixin();    var winHeight = typeof window.innerHeight != 'undefined' ? window.innerHeight : document.documentElement.clientHeight;    var weixinTip = $('<div id="weixinTip"><p><img src="live_weixin.png" alt="微信打开"/></p></div>');        if(isWeixin){      $("body").append(weixinTip);    }else{      window.location.href="www.yishengqiao.com/1/DoctorBridge.apk";    }    $("#weixinTip").css({      "position":"fixed",      "left":"0",      "top":"0",      "height":winHeight,      "width":"100%",      "z-index":"1000",      "background-color":"rgba(0,0,0,0.8)",      "filter":"alpha(opacity=80)",    });    $("#weixinTip p").css({      "text-align":"center",      "margin-top":"10%",      "padding-left":"5%",      "padding-right":"5%"    });  </script></body></html>