H5跳转微信公众号解决方案

1.适用场景

适用H5跳转公众号的场景

2.跳转方案

微信内H5跳转

微信内可链接直接跳转公众号关注页。
登陆微信公众平台,F12打开浏览器控制台console输入wx.commonData.data.uin_base64
在这里插入图片描述

https://mp.weixin.qq.com/mp/profile_ext?action=home&__biz=上方步骤输出的内容#wechat_redirect
该链接可直接在微信内进入公众号关注页(非公众号客户端不支持)。
在这里插入图片描述

微信外部H5跳转

微信外部浏览器无法链接直接打开公众号。
可采用 H5页面——>唤起微信小程序——>小程序引导页——>公众号客服的跳转流程。

申请企业认证小程序后,对接小程序跳转能力
在这里插入图片描述
官方提供了几种跳转能力,推荐使用urlLink,获取到https跳转链接,兼容性更好。
接口可直接返回跳转链接,但是每个链接只能一个用户使用,有效期最长30天,可结合redis缓存实现。
在这里插入图片描述
h5页面点击直接跳转小程序链接,将唤起微信公众号小程序,
在这里插入图片描述
小程序页面展示微信公众号关注引导页面,用户点击直接进入公众号。可在公众号发布一篇推文,插入公众号名片二维码等元素,使用小程序web-view组件展示,快速实现引导页。
在这里插入图片描述
用户可通过点击公众号蓝色字体,公众号名片或扫码进入公众号。

  • 4
    点赞
  • 18
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
要在uniapp中开发H5登录微信公众号并进行联调,有以下几个步骤: 1. 获取微信开发者账号和相关配置信息:首先需要在微信开放平台注册并创建一个开发者账号,然后创建一个微信公众号,并获取相应的AppID和AppSecret等配置信息。 2. 在uniapp项目中配置相关插件:在uniapp项目的manifest.json文件中,添加对应的插件配置,如"@dcloudio/uni-mp-weixin"插件。然后在项目的App.vue中通过uni.login方法获取登录凭证code,并调用uni.request方法发送请求到服务器获取用户的openid和session_key。 3. 前端与后端的联调:根据服务器返回的用户openid和session_key,在前端进行相关的业务逻辑处理,如展示用户信息、跳转到其他页面等。其中,服务器端需要处理用户的登录请求,并返回openid和session_key等信息给前端。 4. 微信公众号授权设置:在微信公众号后台设置中,配置网页授权域名和回调地址,并将uniapp项目的H5链接添加到公众号菜单中。 5. 测试和调试:完成以上步骤后,进行测试和调试,确保登录功能在H5中正常使用。可以通过调试工具、日志打印等方式进行定位和解决问题。 总结:在uniapp开发H5登录微信公众号的联调过程中,需要进行微信开发者账号和相关配置的准备,配置相关插件和设置,前端与后端的联调,以及进行测试和调试。通过这些步骤,可以实现在uniapp项目中登录微信公众号并进行H5联调。
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值