微信浏览器唤起本地浏览器 微信跳转外部浏览器打开的实现

上半年公司有一个新的APP项目上线,我们在项目首页做个二维码,然后用户用手机扫一扫就能下载了。但是很多用户反映扫一扫之后下载不了,了解之后才知道这些用户都是使用的微信的扫一扫,而我们开发测试人员一般使用uc之类的浏览器做扫描。上网查了一下,微信自带的内置浏览器屏蔽了下载功能,所以才出现用微信扫一扫不能下载的情况。这时候我们一般会建议用户使用uc或者其他第三方浏览器自带的扫一扫功能下载。但是现在的微信太普及了,很多人都习惯性的使用微信来扫码下载,总不能每个用户都解释一遍,所以我们一直在寻找解决方案。 要解决这个问题思路很明确,既然微信内置浏览器不支持下载,那就只能想办法调用外部浏览器来下载。所以我们在寻找这么一种方案:用户点了某个推广链接如何调用外部的浏览器实现下载功能呢?

 好了,废话不多说了,直接上方案。

 

r7t7bmco.png

 

 

 

 

 

方案1:

弹出一个遮罩提示用户在新的浏览器窗口打开。

 

 

 

使用的是纯JS+HTML+CSS结合的方式,但不要一进入微信就弹出提示它在新浏览器中打开,在这个页面里面还可以提交表单查看信息等,只有它点击应用的链接后,才弹出提示它跳转后下载。

想要制作而又不懂技术的朋友可以前往

部分代码(网上有很多,我就不献丑了)

a>

×span>p>div>

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';

}

}

}

方案2:

这个方案就是我们现在用的这种,相比第一种的话,转化率方面都有显著发的提升,

这个方案需要我们借助一个外部的接口来实现此功能 

我们在他们那边租用了此接口。

通过租用的接口可以实现安卓端微信直接唤醒手机默认浏览器打开指定的链接,从而实现下载APP的功能,

 

 

具体实现原理:

利用HTTP请求中Header中的user-agent字段,来识别用户的客户端,如果判断用户是在微信中打开的链接,则自动打开系统手机浏览器来打开链接。如果是在手机浏览器打开,则正常访问。

判断用户客户端的Javasript代码如下:

function is_wechat_client(){

      var ua = navigator.userAgent.toLowerCase();

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

          return true;

      }else{

          return false;

      }

}

好了,亲们,上面两种办法笔者都尝试过了,均可行。如果你有更好的办法可以在此处留言,方便广大码友

### 回答1: 要从外部的H5页面跳转微信公众号的关注页面,需要进行以下步骤: 1. 确认微信公众号的原始ID 在微信公众号后台,可以在“设置”-“公众号设置”-“帐号详情”中找到公众号的原始ID。 2. 在外部H5页面上添加关注链接 在外部H5页面上添加一个链接,链接的URL为以下格式: ``` https://mp.weixin.qq.com/mp/profile_ext?action=home&__biz=[公众号的原始ID]#wechat_redirect ``` 请将[公众号的原始ID]替换为你的微信公众号的原始ID。 例如,如果微信公众号的原始ID为“wx123456789”,则链接的URL为: ``` https://mp.weixin.qq.com/mp/profile_ext?action=home&__biz=wx123456789#wechat_redirect ``` 3. 用户点击链接后跳转微信公众号关注页面 当用户在非微信浏览器打开外部H5页面,并点击上述链接时,会自动跳转微信公众号的关注页面。 请注意,用户必须使用微信浏览器打开关注链接才能正常关注公众号。如果用户在非微信浏览器打开链接,可能无法正常关注公众号。 ### 回答2: 从外部h5非微信浏览器跳转微信公众号关注页面有以下几种方法: 1. 生成关注链接:在微信公众号平台获取自己的微信公众号关注链接,一般是类似于https://mp.weixin.qq.com/mp/profile_ext?action=home&__biz=XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX==#wechat_redirect的形式。将这个链接嵌入到外部H5页面中,用户点击链接即可跳转微信公众号关注页面。 2. 使用微信公众号二维码:在微信公众号平台生成一个关注该公众号的二维码,然后将二维码图片插入到外部H5页面中。用户打开外部H5页面后,扫描二维码即可跳转微信公众号关注页面。 3. 利用微信JSSDK:通过在外部H5页面中引入微信官方提供的JSSDK,在页面中调用微信的相关API,实现跳转微信公众号关注页面。具体做法是首先通过wx.config进行配置,然后使用wx.ready监听JSSDK配置完成后的事件,最后使用wx.openUrl指定跳转的URL,将其设置为微信公众号的关注链接。 总之,以上是从外部H5非微信浏览器跳转微信公众号关注页面的几种方法,其中常用的是生成关注链接和使用微信二维码的方式。具体选择哪种方法,可根据实际需求和开发环境来决定。 ### 回答3: 如果要从外部H5非微信浏览器跳转微信公众号关注页面,可以通过以下几种办法: 1. 生成个人或公众号的二维码:可以在微信公众号后台或者第三方平台上生成一个关注公众号的二维码。在H5页面上将该二维码展示出来,用户可以使用手机扫描二维码,跳转微信客户端的公众号关注页面。 2. 使用微信授权登录:在H5页面上使用微信的网页授权登录功能,引导用户使用微信账号登录,并获取到用户的openid。在登录成功后,再通过微信JS-SDK的接口,调用相关功能,弹出关注公众号的页面,引导用户关注。 3. 在H5页面中使用微信JS-SDK的接口:可利用微信JS-SDK的相关功能,如打开特定网页、唤起微信扫一扫等。在H5页面上加入一个关注按钮,点击按钮后调用JS-SDK接口,跳转微信公众号的关注页面。 需要注意的是,以上方法在实际应用中需要满足一些条件,比如需要有正式的微信公众号,需要进行相应的配置,以及需要获取微信JS-SDK的权限等。另外,不同的微信版本和设备可能对跳转行为有一定的限制,因此在操作时要注意兼容性的问题。
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值