微信实现自动跳转到用其他浏览器打开指定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使用prototype定义对象类型(转)[
Dec 22 Javascript
Javascript 写的简单进度条控件
Jan 22 Javascript
jquery 插件 web2.0分格的分页脚本,可用于ajax无刷新分页
Dec 25 Javascript
JavaScript中使用ActiveXObject操作本地文件夹的方法
Mar 28 Javascript
JavaScript实现俄罗斯方块游戏过程分析及源码分享
Mar 23 Javascript
jquery实现TAB选项卡鼠标经过带延迟效果的方法
Jul 27 Javascript
jQuery实现文本框邮箱输入自动补全效果
Nov 17 Javascript
json的结构与遍历方法实例分析
Apr 25 Javascript
js实现数组和对象的深浅拷贝
Sep 30 Javascript
NestJs 静态目录配置详解
Mar 12 Javascript
JS实现利用闭包判断Dom元素和滚动条的方向示例
Aug 26 Javascript
vue-next/runtime-core 源码阅读指南详解
Oct 25 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
用PHP连接Oracle数据库
2006/10/09 PHP
PHP中strlen()和mb_strlen()的区别浅析
2014/06/19 PHP
php ci框架中加载css和js文件失败的原因及解决方法
2014/07/29 PHP
WordPress开发中短代码的实现及相关函数使用技巧
2016/01/05 PHP
ThinkPHP表单令牌错误的相关解决方法分析
2016/05/20 PHP
laravel框架中间件 except 和 only 的用法示例
2019/07/12 PHP
js 全兼容可高亮二级缓冲折叠菜单
2010/06/04 Javascript
有趣的javascript数组定义方法
2010/09/10 Javascript
jquery ajax 局部无刷新更新数据的实现案例
2014/02/08 Javascript
javascript实现修改微信分享的标题内容等
2014/12/11 Javascript
sails框架的学习指南
2014/12/22 Javascript
JavaScript实现网页加载进度条代码超简单
2015/09/21 Javascript
跟我学习javascript的异步脚本加载
2015/11/20 Javascript
基于JavaScript实现全屏透明遮罩div层锁屏效果
2016/01/26 Javascript
JS面向对象编程详解
2016/03/06 Javascript
JS简单实现仿百度控制台输出信息效果
2016/09/04 Javascript
swiper插件自定义切换箭头按钮
2017/12/28 Javascript
js 索引下标之li集合绑定点击事件
2018/01/12 Javascript
js判断输入框不能为空格或null值的实现方法
2018/03/02 Javascript
微信小程序 多行文本显示...+显示更多按钮和收起更多按钮功能
2019/09/26 Javascript
VUE+elementui组件在table-cell单元格中绘制微型echarts图
2020/04/20 Javascript
Python实现的RSS阅读器实例
2015/07/25 Python
实践Python的爬虫框架Scrapy来抓取豆瓣电影TOP250
2016/01/20 Python
Python实现在线暴力破解邮箱账号密码功能示例【测试可用】
2017/09/06 Python
Python编程django实现同一个ip十分钟内只能注册一次
2017/11/03 Python
Python基于回溯法解决01背包问题实例
2017/12/06 Python
Python字符串、列表、元组、字典、集合的补充实例详解
2019/12/20 Python
基于TensorFlow常量、序列以及随机值生成实例
2020/01/04 Python
html5中valid、invalid、required的定义
2014/02/21 HTML / CSS
加拿大快时尚零售商:Ardene
2018/02/14 全球购物
Nike澳大利亚官网:Nike.com (AU)
2019/06/03 全球购物
GWT都有什么特性
2016/12/02 面试题
中西医专业毕业生职业规划书
2014/02/24 职场文书
《分数的意义》教学反思
2016/02/20 职场文书
Node与Python 双向通信的实现代码
2021/07/16 Javascript
python数字图像处理:图像简单滤波
2022/06/28 Python