...
在小程序加载兔展作品的时候, H5 会在不同的时机发送处理好的分享链接给小程序, 见微信文档
https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/practice/appshare.html
数据格式如下:
{ "type" : "EXT_APP_H5_SHARE_LINK" ,
"payload" : {
"shareLink" : "" ,
"triggerShareLink" : "" ,
|
"imgUrl" : "" ,
"desc" : "" ,
"title" : "" ,
}
}
|
对接方案
1. 从页面参数中拿到链接并展示
2. 分享前获取 H5 发来的处理好的分享链接(请做好接收不到信息的兼容逻辑)
例如:"https://renderer.rabbitpre.com/m2/F9CtGazId6i?=&lc=1&sui=oXaEF54LZniS2lJMeHg9wj_4ow0U&saudid=913154741931360256&from=singlemessage#from=share"
distinctid/viewid:访客id,优先级:unionid>openid>cookie中存在的distinctid>直接生成的uuid并存入cookie
sui:分享来源者的distinctid/viewid
audid:用户档案id
saudid:分享来源者的audid
lc:传播层级,每分享一次+1,为避免自己分享给自己,会对audid和saudid进行比较判断
actid:场景活动id
cnl:渠道id
cnltype:渠道类型
from:来源(singlemessage 朋友)
3. 分享时把分享链接放到页面参数中
示例如下:
< web-view src = "{{link}}" bindmessage = "handleMessage" />
|
let nextLink = ''
let triggerShareLink = ''
Page({
data: {
link: "" ,
nextLink: ""
},
onLoad(options) {
wx.showShareMenu();
const currentLink = options.link && decodeURIComponent(options.link);
console.error( '1. 从页面参数中拿到链接并展示' , currentLink)
nextLink = currentLink
triggerShareLink = currentLink;
this .setData({
link: currentLink
})
},
handleMessage: (event) => {
console.log( 'onMessage' , event)
event.detail.data.forEach((current) => {
if (current.type === "EXT_APP_H5_SHARE_LINK" ) {
nextLink = current.payload.shareLink
triggerShareLink = current.payload.triggerShareLink
}
})
console.error( '2. 分享前获取 H5 发来的处理好的分享链接' , {
nextLink,
triggerShareLink
})
},
onShareAppMessage() {
const path = `/pages/index/index?link=${encodeURIComponent(nextLink)}`
console.error( '3. 分享时把分享链接放到页面参数中' , path)
console.error( '4. 触发 H5 分享埋点上报' , triggerShareLink)
this .setData({
link: triggerShareLink
})
return {
path
}
}
})
|
完整示例附件
View file |
---|
name | ext-miniapp-h5-preview.zip |
---|
height | 250 |
---|
|