A小程序与B小程序相互跳转的一点记录
要点速览:
- A小程序和B小程序关联同一个公众号
- B程序的用户授权
- A小程序和B小程序的用户关联
- 诸葛 io 统计用户访问信息
需求:微信放开小程序互跳的 API 后,一些导流和拉新等活动可以在新的小程序实现
从微信官方文档中,小程序之前的互相跳转使用 wx.navigateToMiniProgram 跳转,但是最新版本使用 <navigator> 组件来使用。参考下示例 demo:
<view class="demo">
<navigator
path="pages/index/index?uid={{uid}}" // 跳转路径,可以传参
target="miniProgram" // 跳转目标
app-id='wx3619c30049ec8aed' // 需要跳转的小程序ID
version="develop" // 当前小程序和目标小程序一致
open-type='navigate' // 跳转小程序
class="demo_text">
</navigator>
</view>
具体参考官方文档 =>
官方 navigator 文档
一、B小程序的用户授权
首先用户初次进入B程序后给一个蒙层,用户点击后主动去授权,然后拿到用户的授权信息后再进行操作,拒绝操作后蒙层不消失。
通过 wx.getUserInfo 获取用户信息,然后将临时获取的 code 值以及向量等值参数传给后端,获取到用户信息,如openId、userId 以及 token 存入全局以及缓存中,完成后重新调用 onLoad 函数 。
在 onLoad 函数中有一步很重要的操作就是获取 openId 来判断是否授权成功,这里我一开始是通过异步接口 wx.getstoragesync 获取,
但是部分安卓机型会第一次授权不成功,原因就在于设置缓存的时候是通过同步的方式,但是获取的时候是异步,导致偶尔获取不到,后来改成从 全局 中获取 openId 就没有这个问题了。
二、A程序和B程序的用户关联
我们的目标还是拉新和引流,所以我们需要把关联B程序的用户引入A小程序并且关联起来用户信息,
单个小程序中唯一标识是 openId ,但是多个小程序关联我们的唯一标识是 unionid ,我们授权登录的接口中,我们先调用了 wx.getUserInfo 返回的成功回调包含 iv,rawData,signature,encryptedData等字段 ,然后调用 wx.login 获取 code 再统一传入后端解密得到解密后需要的用户信息,这里rawData,signature 是来做校验的。
从B程序跳入A后,我们携带B程序的 user_id 等参数,然后传入B的 user_id 以及A的 user_id 去查询库中是否存在关联的 unionid ,这里A的授权登录操作和之前一样,略过。
步骤如下:
三、诸葛 io 统计用户访问信息
诸葛 io 类似于微信统计,都是一种埋点统计功能,我们常用的数据存储和分析载体是 事件 ,通过对用户行为的分析提供更好的服务以及实现数据驱动的精准运营。
通过安装诸葛的 sdk,然后在通过事件监听的机制了解到用户进入了哪个商品以及行为,官网的 demo 如下:
zhuge.track('进入商品详情页', {
'商品名称' : '【联通赠费版】Apple iPhone 7 Plus 128G 黑色 移动联通电信4G手机',
'商品价格' : 6588.00,
'商品一级分类' : 手机,
'商品品牌' : 'Apple'}); //属性名称不能超过255个字符,属性值不能超过200个字符
通过这种埋点统计我们很方便的可视化了解到用户的喜好和行为以及留存率等等指标,为后续的运营活动提供更精准的投放。
详情请参考=>诸葛io文档
四、A小程序跳转B小程序
从老站跳新站其实流程一样,同样需要传入老站的 user_id 去做关联操作,但是有一个不一样的是不需要授权后走关联接口,可以直接在授权的时候
将老站的 user_id 直接从登录接口中传入即可。
A小程序与B小程序相互跳转的一点记录的更多相关文章
- [转]微信小程序、微信公众号、H5之间相互跳转
本文转自:https://www.cnblogs.com/colorful-paopao1/p/8608609.html 转自慕课网 一.小程序和公众号 答案是:可以相互关联. 在微信公众号里可以添加 ...
- 微信小程序、微信公众号、H5之间相互跳转
转自慕课网 一.小程序和公众号 答案是:可以相互关联. 在微信公众号里可以添加小程序. 图片有点小,我把文字打出来吧: 可关联已有的小程序或快速创建小程序.已关联的小程序可被使用在自定义菜单和模版消息 ...
- 微信小程序和公众号和H5之间相互跳转
参考链接:https://www.imooc.com/article/22900 一.小程序和公众号 答案是:可以相互关联. 在微信公众号里可以添加小程序. 可关联已有的小程序或快速创建小程序.已关联 ...
- 小程序 公众号/h5相互跳转-webview
小程序与h5的跳转 前提小程序管理后台配置域名白名单,并且h5页面是嵌在小程序里面(相互跳的前提条件) 在业务域名中设置好访问的h5地址 微信官方web-view 介绍地址 https://devel ...
- 详解封装微信小程序组件及小程序坑(附带解决方案)
一.序 上一篇介绍了如何从零开发微信小程序,博客园审核变智障了,每次代码都不算篇幅,好好滴一篇原创,不到3分钟从首页移出来了.这篇介绍一下组件封装和我的踩坑历程. 二.封装微信小程序可复用组件 首先模 ...
- 【小程序】微信小程序打开其他小程序(打开同一主体公众号下关联的另一个小程序)
微信小程序打开其他小程序(打开同一公众号下关联的另一个小程序) 注:只有同一(主体)公众号下的关联的小程序之间才可相互跳转 wx.navigateToMiniProgram(OBJECT) wx.n ...
- 微信小程序转支付宝小程序
使用方法: npm install wx-alipay -g wxToalipay --src={{小程序源码目录}} --dest={{支付宝小程序目录,可缺省}} 点击回车后就可将微信小程序转换为 ...
- 张小龙的野心:用小程序重构web|小程序好处及可能的不足
一:张小龙的野心:用小程序重构web 一 很多年以前,张小龙写了一款软件:Foxmail. 这款软件当年有数百万用户,这是一个相当庞大的量,因为彼时网民也只有千万当量级的规模. 我是一个非常忠实的用户 ...
- [小程序开发] 微信小程序内嵌网页web-view开发教程
为了便于开发者灵活配置小程序,微信小程序开放了内嵌网页能力.这意味着小程序的内容不再局限于pages和large,我们可以借助内嵌网页丰富小程序的内容.下面附上详细的开发教程(含视频操作以及注意事项) ...
随机推荐
- 转 Linux下安装Tomcat服务器和部署Web应用
转载声明: http://www.cnblogs.com/xdp-gacl/p/4097608.html 一.上传Tomcat服务器
- Web应用程序自动化测试工具Selenium的主要功能有哪些?
Selenium是一个用于Web应用程序测试的工具.是一个开源的Web的自动化测试工具,最初是为网站自动化测试而开发的,类型像我们玩游戏用的按键精灵,可以按指定的命令自动操作,不同是Selenium可 ...
- Mock平台2-Java Spring Boot框架基础知识
微信搜索[大奇测试开],关注这个坚持分享测试开发干货的家伙. 认识Spring Boot 在N年前的大学时代想要开发一个Web服务使用的还是SSH框架(struts+spring+hibernate) ...
- tp6微信公众号开发者模式token认证
微信公众号开发完整教程(一) PHP7.0版本,TP5.0框架 技术标签: 微信公众号开发 因为工作的需要,这一两年对微信公众号和小程序,项目制作的比较多.所以我才打算写一篇全面的 ...
- 统计学中数据分布的偏度(skewness)和峰度(kurtosis)
- JavaSE 千寻简学习笔记
JavaSE 千寻简学习笔记 简介 TIOBE:编程语言排行榜 官网:https://hellogithub.com/report/tiobe/ 如何高效的学习Java 多写(代码)多写(笔记)多写( ...
- LGP4587题解
遇到一道题,我们该做什么? 打暴力. 此题的暴力是什么?从小到大枚举答案.但这太慢了,需要一个结论来加速一下: 若 \([1,x]\) 都能够被表示出来,新加入一个数 \(y\),若 \(y>x ...
- 手写 Vue2 系列 之 patch —— diff
前言 上一篇文章 手写 Vue2 系列 之 初始渲染 中完成了原始标签.自定义组件.插槽的的初始渲染,当然其中也涉及到 v-bind.v-model.v-on 指令的原理.完成首次渲染之后,接下来就该 ...
- 解决移动端ios网页端收起键盘导致的页面空白问题
一句代码就搞定了,只要失焦的时候把窗口滚动位置设置到(0,0)就行了 <input type="text" onblur="window.scrollTo(0, 0 ...
- git命令新建远程分支并推送,切换远程地址
最近记性不好,老是忘记操作命令,记录下一下新建远程分支和切换.删除远程地址的命令: 1.查看当前分支: git branch 2.查看所有分支:git branch -a 3.切换分支:git ch ...