微信实现自动跳转到用其他浏览器打开指定APP下载


Posted in Javascript onFebruary 15, 2019

目前的APP基本都支持二维码扫描下载,二维码下载也成为了大家用起来很顺手的一种方式。由于微信的用户基本占据了国内市场的90%,说到扫一扫用户第一个想到的就是打开微信扫一下,通过微信分享APP,再从分享的链接下载apk/ios包。故用户通常都是使用微信打开链接或扫描二维码前往下载页,这是刚需。

在我们做营销活动或推广宣传的时候,容易遇到域名被封,无法跳转app下载等情况。这时需要微信跳转外部浏览器打开页面的功能,对于ios用户默认可以通过微信内置浏览器点击右上角的更多按钮从而选择“在浏览器中打开”,对于安卓用户则可以实现微信内直接跳出到手机默认浏览器。但是很多用户其实并不知道该任何实现,其实只要在代码中进行相关的处理即可。下面为大家介绍这两种方式的实现方式,不仅可以防封,还可以达到跳转手机浏览器的效果。

需求分析

现在微信分享的功能很多,从分享的链接下载apk或者ios文件是很常用的一个功能。但是微信scheme接口会自动屏蔽含apk或ios文件的下载链接,不允许直接通过微信下载安装文件。如果域名访问次数过多后被系统检测会自动封掉该域名。被封域名后台用户在微信中打开连接就会提示不存在或已停止访问的提示。但很多用户不知道是被屏蔽了,故以为是链接有问题,最后在该步骤流失的量就会很大,推广转化率就会很低。那么究竟该如何解决这个问题呢?

代码编程

HTML代码

var ua = navigator.userAgent;
var isWeixin = !!/MicroMessenger/i.test(ua);

CSS代码

#weixin-tip{display:none;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%;position:relative;}
 #weixin-tip .close{color:#fff;padding:5px;font:bold 20px/24px simsun;text-shadow:0 1px 0 #ddd;position:absolute;top:0;left:5%;}

JS封装代码

var is_weixin = (function(){return navigator.userAgent.toLowerCase().indexOf(‘micromessenger') !== -1})();
 window.onload = function() {
 var winHeight = typeof window.innerHeight != ‘undefined' ? window.innerHeight : document.documentElement.clientHeight; //兼容IOS,不需要的可以去掉
 var btn = document.getElementById(‘J_weixin');
 var tip = document.getElementById(‘weixin-tip');
 var close = document.getElementById(‘close');
 if (is_weixin) {
 btn.onclick = function(e) {
 tip.style.height = winHeight + ‘px'; //兼容IOS弹窗整屏
 tip.style.display = ‘block';
 return false;
 }
 close.onclick = function() {
 tip.style.display = ‘none';
 }
 }
 }

至此,我们就可以直接用微信扫描二维码在微信中分享和宣传引流了。这样我们能够极大的提高自己的APP在微信中的推广转化率。解决掉了微信中下载链接被屏蔽等问题。充分利用微信的用户群体来宣传引流。

旋风微跳是一款基于微信后端开发了一款微信营销下载推广助手,使用了本插件生成的链接,用户在微信任意环境下点击链接或者扫描二维码,可以实现直接跳转手机默认浏览器并打开指定网页。

旋风微跳 网址:http://www.zjychina.cn

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript import css实例代码
Jul 18 Javascript
JavaScript中关于indexOf的使用方法与问题小结
Aug 05 Javascript
js中小数转换整数的方法
Jan 26 Javascript
js中javascript:void(0) 真正含义
Nov 05 Javascript
用js写的一个路由(简单实例)
Sep 24 Javascript
详解vue的数据binding绑定原理
Apr 12 Javascript
javascript高级模块化require.js的具体使用方法
Oct 31 Javascript
JavaScript设计模式之缓存代理模式原理与简单用法示例
Aug 07 Javascript
使用vue-router切换页面时,获取上一页url以及当前页面url的方法
May 06 Javascript
layui监听下拉选框选中值变化的方法(包含监听普通下拉选框)
Sep 24 Javascript
React+Redux实现简单的待办事项列表ToDoList
Sep 29 Javascript
vue+vant使用图片预览功能ImagePreview的问题解决
Apr 10 Javascript
微信小程序实现联动选择器
Feb 15 #Javascript
推荐一个基于Node.js的表单验证库
Feb 15 #Javascript
微信小程序实现左右列表联动
May 19 #Javascript
webpack-url-loader 解决项目中图片打包路径问题
Feb 15 #Javascript
微信小程序实现单选选项卡切换效果
Jun 19 #Javascript
一秒学会微信小程序制作table表格
Feb 14 #Javascript
React通过redux-persist持久化数据存储的方法示例
Feb 14 #Javascript
You might like
收音机另类DIY - 纸巾盒做外壳
2021/03/02 无线电
PHP处理Json字符串解码返回NULL的解决方法
2014/09/01 PHP
php常用字符串比较函数实例汇总
2014/11/24 PHP
php获取错误信息的方法
2015/07/17 PHP
利用php-cli和任务计划实现刷新token功能的方法
2017/05/03 PHP
解决AJAX中跨域访问出现'没有权限'的错误
2008/08/20 Javascript
让GoogleCode的SVN下的HTML文件在FireFox下正常显示.
2009/05/25 Javascript
JS运行耗时操作的延时显示方法
2010/11/19 Javascript
JavaScript日期类型的一些用法介绍
2015/03/02 Javascript
JavaScript中利用各种循环进行遍历的方式总结
2015/11/10 Javascript
第三章之Bootstrap 表格与按钮功能
2016/04/25 Javascript
JavaScript学习笔记整理_setTimeout的应用
2016/09/19 Javascript
jQuery Validate表单验证插件的基本使用方法及功能拓展
2017/01/04 Javascript
JavaScript中document.referrer的用法详解
2017/07/04 Javascript
Node之简单的前后端交互(实例讲解)
2017/11/14 Javascript
VueJs监听window.resize方法示例
2018/01/17 Javascript
Vue 幸运大转盘实现思路详解
2019/05/06 Javascript
nodejs实现聊天机器人功能
2019/09/19 NodeJs
使用vue引入maptalks地图及聚合效果的实现
2020/08/10 Javascript
在vue中配置不同的代理同时访问不同的后台操作
2020/09/11 Javascript
在Python3中使用asyncio库进行快速数据抓取的教程
2015/04/02 Python
python中列表元素连接方法join用法实例
2015/04/07 Python
网红编程语言Python将纳入高考你怎么看?
2018/06/07 Python
Python静态类型检查新工具之pyright 使用指南
2019/04/26 Python
Python Flask框架模板操作实例分析
2019/05/03 Python
python实现QQ批量登录功能
2019/06/19 Python
python实现俄罗斯方块游戏(改进版)
2020/03/13 Python
CSS3中利用animation属性创建雪花飘落特效
2014/05/14 HTML / CSS
CSS3实现线性渐变用法示例代码详解
2020/08/07 HTML / CSS
香港时装购物网站:ZALORA香港
2017/04/23 全球购物
泰国在线书店:SE-ED
2020/06/21 全球购物
竞选学生会演讲稿
2014/04/25 职场文书
大队干部竞选演讲稿
2014/04/28 职场文书
解除聘用合同证明书范本
2014/09/11 职场文书
长江三峡导游词
2015/01/31 职场文书
银行柜员优质服务心得体会
2016/01/22 职场文书