前言
小明今天接到一个需求，给分享的页面进行溯源，要求如下
- 员工信息的溯源
- 当A工作人员分享自己的页面给客户B时候，需要带上A的溯源信息
- 当客户B分享自己的页面到好友C的时候，此时应该带上的是员工A的溯源信息
- 分享渠道的溯源
深入理解需求，员工信息溯源要的请求就是每一个新的客户，以及其分享的好友，都需要溯源到第一位员工身上，像拉新客户这种场景，要溯源每一个新客户是哪位优秀员工拉进来的。其次是分享渠道，就是分享出去的url带上一个特定渠道，用于标识这批客户上由哪个渠道投流，或者做什么活动引进来的。
整体概览
小明需要改造的项目是一个使用Taro进行小程序端和h5端双端的项目，也就是该需求要同时满足小程序分享和h5分享
小程序分享
小程序分享分有分享好友和分享朋友圈，还有复制链接，如同所示三部分
h5分享
- 直接复制链接进行分享
- 当作为某个app的内嵌h5，或者在特定的环境下，有一些js bridge的分享方法可以调用
总结
由于分享途径很多，而且小程序的微信朋友圈分享只能说当前页面的url，不允许js为其携带参数，所有最好的办法是当得到溯源信息后，直接replace页面的url，这样无论是哪种场景进行分享都能带上
整体流程
首先，进入页面和登录这两个时机，进行着初始化溯源信息到url上的工作。其次，在每个请求之前都将当前的溯源信息带到url的公共参数。
初始化溯源信息
- 判断url上是否有带溯源信息，有的话就持久化溯源信息，并replace到url上面，因为只有replace到url上面，才能解决用户直接复制当前链接就分享的问题
- 如果url上没有溯源信息，转而就去判断storage上有没有，因为这可能是用户后续的再次登录，有的话也是把溯源信息replace到url上面
- 用户登录的时候，判断如果是员工，且url上的溯源信息不一致，就用当前的用户信息作为溯源第一人，将当前用户信息replace到url上面
请求阶段
- 请求时候判断该请求是否为post请求，get不用写信息，一般也不用带溯源信息
- 取最新的溯源信息加到请求的公共参数部分，例如一个自定义的header字段
例如小明整了一个xiaoming.com/page.html 的页面，小明作为员工打开后，页面的url就会变成xiaoming.com/page.html?f… 这时候他分享出去的链接等，就会带上小明的信息，有新用户注册，老板就能知道这个新用户是小明拉进来的，可以对小明含辛茹苦的工作进行一个量化。
关于渠道的溯源
上述说的是关于用户的溯源信息，如果是关于渠道的溯源就更简单了，也就和用户自身的身份无关，在和上述的流程差不多，但少了登录去更新url上的溯源信息而已。
例如某个url上 xiaoming.com/page.html?c… ,用户打开这个渠道时候把这个渠道信息存起来，后续再次打开、分享、操作，都能归结到这个渠道channel1，具体流程如下
总结
以上就是小明关于溯源的探索和实践方案，和大家分享和学习，希望对大家有帮助，如有实现不好的地方欢迎讨论哈
