今天遇到一个很蛋疼问题，我们的微信公众号上想放一个下载自己公司app的点击按钮，如果是苹果手机点击这个按钮就直接跳转到苹果的appstore，如果是android手机的话，就直接跳我们的服务器下载apk链接，可是一个很蛋疼的问题出现了，微信  不支持   ，所以，我们就想了一个办法，点击这个按钮，然后让其在浏览器上打开，最后这个问题就ok完美解决了，下面分享一下代码和截图：

源码下载github：https://github.com/TopGuo/weixinpop

在线演示：yipin361.com/zyappd/index.html

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>周翼单车app下载</title>

    <script src="js/bootstrap/js/Jquery.js"></script>

</head>

<body>

    <div align="center">

        <img src="img/bg.png" style="margin: 0 auto ">

        <a id="imgId"><img src="img/btn.png"></a>

    </div>

    <script language="javascript">

        $(function () {

            $("#imgId").click(function () {

                download();

            });

        });

        function download() {

            var cssText =

                "#weixin-tip{position: fixed; left:0; top:0; background: rgba(0,0,0,0.8); filter:alpha(opacity=80); width: 100%; height:100%; z-index: 100;} #weixin-tip p{text-align: center; margin-top: 10%; padding:0 5%;}";

            var u = navigator.userAgent;

            if (u.indexOf('Android') > - || u.indexOf('Linux') > -) { //安卓手机

                //判断使用环境

                if (is_weixin()) {

                    loadHtml();

                    loadStyleText(cssText);

                } else {

                    window.location.href = "http://android.zhouyibike.com/app-release.apk";

                }

            } else if (u.indexOf('iPhone') > -) { //苹果手机

                window.location.href = "https://itunes.apple.com/cn/app/id1239249767?mt=8";

            } else if (u.indexOf('Windows Phone') > -) {

                //winphone手机

                alert("机型不匹配！");

            }

        }

        function is_weixin() {

            var ua = navigator.userAgent.toLowerCase();

            if (ua.match(/MicroMessenger/i) == "micromessenger") {

                return true;

            } else {

                return false;

            }

        }

        function loadHtml() {

            var div = document.createElement('div');

            div.id = 'weixin-tip';

            div.innerHTML = '<p><img src="live_weixin.png" alt="请在微浏览器打开"/></p>';

            document.body.appendChild(div);

        }

        function loadStyleText(cssText) {

            var style = document.createElement('style');

            style.rel = 'stylesheet';

            style.type = 'text/css';

            try {

                style.appendChild(document.createTextNode(cssText));

            } catch (e) {

                style.styleSheet.cssText = cssText; //ie9以下

            }

            var head = document.getElementsByTagName("head")[]; //head标签之间加上style样式

            head.appendChild(style);

        }

    </script>

</body>

</html>

效果图如下：

微信为啥不能直接下载.apk安装包的更多相关文章

  1. 关于提高webview里下载apk安装包成功率的研究

    移动互联网发展到当下,各种领域出现了一些大的app平台,这些app共同的特点就是拥有大量忠实活跃用户, 要知道,有用户就有money啊~ 于是乎其他不太知名的平台,开始在他们上面疯狂投放广告,做活动推 ...

  2. 下载apk安装包后，调用安装器自动安装apk（适配7.0）

    在更新操作时,下载新apk之后,往往需要自动安装新apk,用以下代码即可安装下载在本地的apk文件(apkFile) Intent intent = new Intent(); intent.setA ...

  3. php实现在线下载程序安装包功能

    在线下载程序安装包可以很方便在服务器端下载各种程序安装包(Discuz!.phpwind.Dedecms.WordPress....等一些常用程序)并存储在服务器,大大减少站长上传程序安装包时间.默认 ...

  4. 使用zipalign.exe工具优化APK安装包

    zipalign.exe是Android自带的一个档案整理工具,它可以用于优化APK安装包,从而提升Android应用与系统之间的交互效率,提升应用程序的运行速度. 操作步骤: 1.在命令行窗口输入如 ...

  5. Android APK安装包瘦身[转]

    很显然,APK安装包越小越好.下面从代码,资源文件,使用策略几个方面简要介绍下: 代码 保持良好的编程习惯,不要重复或者不用的代码,谨慎添加libs,移除使用不到的libs. 使用proguard混淆 ...

  6. 【Android Studio安装部署系列】十、Android studio打包发布apk安装包

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 概述 使用Android studio发布apk安装包的操作步骤. 开始打包发布apk Build > Generate Signe ...

  7. [Android] Robotium手机自动化测试（仅需apk安装包版）——环境搭建 【转】

    Robotium的手机自动化测试,很多都是利用app源代码里的Id定义来开发自动化脚本.而在我开始要为项目中的app写自动化测试脚本的时 候,开发的环境还很不稳定,app也还处于开发的状态中,而且,在 ...

  8. chrome下载离线安装包的方法

    https://www.google.com/chrome/browser/desktop/index.html?system=true&standalone=1,一般默认下载稳定版,如果需要 ...

  9. ubuntu下载软件安装包

    apt-get -d download xxx ubuntu下载软件安装包命令.仅仅下载deb格式的安装包,不安装. xxx是待下载的安装包.

随机推荐

  1. 剑指offer十之矩形覆盖

    一.题目 我们可以用2*1的小矩形横着或者竖着去覆盖更大的矩形.请问用n个2*1的小矩形无重叠地覆盖一个2*n的大矩形,总共有多少种方法? 二.解答思路 如果第一步选择竖方向填充,则剩下的填充规模缩小 ...

  2. MVC3学习：利用mvc3+ajax实现全选和批量删除

    本例数据库操作使用EF code first; 先利用mvc自带的模板,先生成一个list视图,然后再手动添加复选框和删除按钮 <table> <tr> @*在标题行添加一个全 ...

  3. (转)CentOS7安装Nginx1.14.2

    原文:https://blog.csdn.net/zhyfyz/article/details/84957381 https://blog.csdn.net/q85795362/article/det ...

  4. (转)Python3之os模块

    原文:https://www.cnblogs.com/wang-yc/p/5623981.html 一:简介 os模块主要用于提供系统高级别的操作. 二:常用方法 1 2 3 4 5 6 7 8 9 ...

  5. webgl之五彩光源

    一.Three.js中有哪些光源? 在Three.js中,光源有一个基类THREE.Light(hex),这个hex接受16进制颜色作为参数而初始化光源的颜色,比如我们要定义一种绿色的光源,可以这样来 ...

  6. 手把手教你封装 Vue 组件并使用 NPM 发布

    Vue 开发插件 我们可以先查看Vue的插件的开发规范 我们开发的之后期望的结果是支持 import.require 或者直接使用 script 标签的形式引入,就像这样: ps: 这里注意一下包的名 ...

  7. 百度&高德地图小区景点边界轮廓实现

    经常的我们在使用地图功能时,会发现在选择一个小区或者一个热门景点的时候,地图上面会给出其边界轮廓,能够方便我们知道其范围大小,有时候在我们使用地图组件的时候,也会面临着类似的需求.比如在地图上面标识出 ...

  8. goconfig - INI 解析器

    goconfig简介 goconfig是一个由Go语言开发的针对windows下常见的ini格式的配置文件解析器.该解析器在涵盖了所有ini文件操作的基础之上,又针对Go语言实际开发过程中遇到的一些需 ...

  9. nginx的一次跨域处理

    1.事故 访问图片资源的时候,发生了跨域,具体报错如下所示: 403 Response to preflight request doesn't pass access control check: ...

  10. CUBA Studio 8.0 发布，企业级应用开发平台

    CUBA Platform 是一款开源且免费的企业级应用开发框架,已有将近10年的发展历史,由俄罗斯的 Haulmont  公司开发,CUBA Platform 近期将正式登陆中国,将提供中文网站.中 ...