微信小程序的转发与分享功能_微信小程序转发
一、转发类API
转发类API包括wx.updateShareMenu(Object object)、wx.showShareMenu、wx.hideShareMenu、wx.getShareInfo。
1、wx.updateShareMenu(Object object)
用于更新转发属性，它的参数object有以下属性。
wx.updateShareMenu({withShareTicket:true,
templateInfo:{},success(){})
关于上表中有些不懂的名词定义我做了以下解释:
- withShareTicket(是否使用带shareTicket的转发详情): shareTicket它是微信提供的一个临时票据，主要用于获取微信群的唯一标识openGId,从而实现群相关的社交功能，如群接龙、群排行、群任务。
- isUpdatableMessage是否是动态消息: 动态消息指转发的卡片实时更新如显示任务进度、倒计时、实时结果。
- templateInfo动态消息的模板信息:它是一组预定义的字段，开发者只能更新这些字段的值，如文本、数字、状态，而无法随意修改卡片布局或图片
2、wx.showShareMenu(Object object)和wx.hideShareMenu(Object object)
显示(隐藏)当前页面的默认分享按钮。某些页面（如支付页、个人中心）禁止用户转发,所以需要使用wx.hideShareMenu(Object object)隐藏页面右上角的转发按钮。
3、wx.getShareInfo(Object object)
用于获取转发的详细信息，它的参数object如下表所示。
二、分享类API
(1)wx.shareVideoMessage(Object object)分享视频消息
直接分享本地视频文件给好友，无需用户手动点击右上角菜单。视频需先下载到本地，不能直接分享网络链接。
使用场景:
- 用户生成或编辑视频后一键分享给好友。
- 适用于需要主动触发分享的场景，如按钮点击。
// 先下载视频到本地
wx.downloadFile({
url: \'https://example.com/video.mp4\',
success(res) {
const tempFilePath = res.tempFilePath;
// 分享视频
wx.shareVideoMessage({
videoPath: tempFilePath,
title: \'分享视频标题\',
success() {
console.log(\'分享成功\');
}
});
}
});
注:
- 仅支持本地视频文件路径。
- 需要用户主动触发，不能自动调用。
- 视频大小限制。
(2)wx.shareFileMessage(Object object)分享文件消息
直接分享本地文件，如pdf,word,Excel给好友,文件需先下载到本地。
使用场景:
- 办公类小程序分享文档，如合同、报告。
- 教育类小程序分享课件、资料。
wx.downloadFile({
url: \'https://example.com/document.pdf\',
success(res) {
wx.shareFileMessage({
filePath: res.tempFilePath,
fileName: \'重要文件.pdf\',
success() {
console.log(\'文件分享成功\');
}
});
}
});
注:
- 仅支持本地文件路径。
- 需要用户主动触发，如按钮点击。
(3)wx.showShareImageMenu(Object object)分享图片菜单
显示图片分享菜单，用户可以选择发送给好友、保存到相册等，支持多张图片同时分享。
使用场景:
- 图片社交类小程序如摄影、壁纸分享。
- 用户生成海报后，提供更多分享选项，如保存、转发。
wx.downloadFile({
url: \'https://example.com/image.jpg\',
success(res) {
wx.showShareImageMenu({
path: res.tempFilePath, // 单张图片
// paths: [res.tempFilePath], // 多张图片（基础库 2.25.0+）
success() {
console.log(\'图片菜单调起成功\');
}
});
}
});
注:
- 支持单张或多张图片。
- 用户可选择发送给好友或保存到相册，无需额外权限。
三、菜单类API
wx.showActionSheet(Object object)
显示操作菜单。
wx.showActionSheet({ itemList: [\'A\', \'B\', \'C\'], success (res) { console.log(res.tapIndex) }, fail (res) { console.log(res.errMsg) }})使用场景:
比如长按图片弹出分享菜单，可以使用该api定义弹出菜单的选项，如发送给朋友、保存到相册，并根据不同选项设置不同的逻辑，调用不同的方法。
四、转发类API应用范例
在微信小程序中，wx.updateShareMenu、wx.showShareMenu、wx.hideShareMenu和 wx.getShareInfo是用于控制转发菜单和处理转发信息的API。它们与传统的分享功能（如 onShareAppMessage 和 onShareTimeline）结合使用，可以实现灵活的转发和分享逻辑。
**示例**：
(1) 显示当前页面的转发按钮wx.showShareMenu({
withShareTicket: true, // 是否使用带 shareTicket 的转发（可用于获取群信息）
menus: [\'shareAppMessage\', \'shareTimeline\'] // 指定显示的转发类型（聊天或者群聊/朋友圈）
})
(2)隐藏转发按钮
wx.hideShareMenu()
(3) wx.updateShareMenu(Object object)
结合 onShareTimeline实现朋友圈自定义分享。
wx.updateShareMenu({
withShareTicket: true, // 是否携带 shareTicket（可用于获取群信息）
isPrivateMessage: false, // 是否私密消息（默认 false）
activityId: \'xxx\', // 可选，活动ID（特定场景使用）
menus: [\'shareAppMessage\', \'shareTimeline\'] // 指定可用的转发类型
});
(4) wx.getShareInfo(Object object)
用户转发到微信群后，通过传入的参数shareTicket获取该群的 openGId，实现群排行、群任务等社交功能。
wx.getShareInfo({
shareTicket: \'xxxxxx\', // 从 onShareAppMessage 返回的 shareTicket
success(res) {
console.log(\'加密数据:\', res.encryptedData);
console.log(\'IV:\', res.iv);//加密算法的初始向量
// 需后端解密获取 openGId
}
});
五、如何实现转发和分享功能？
完整流程:
- 控制转发菜单（wx.showShareMenu / wx.hideShareMenu / wx.updateShareMenu）
- 定义转发内容（onShareAppMessage/ onShareTimeline）
- 处理转发结果（wx.getShareInfo获取群信息）
5.1基础转发（到聊天)
Page({
onLoad() {
// 显示转发按钮（默认显示，可省略）
wx.showShareMenu();
},
// 定义转发内容（用户点击右上角转发时触发）
onShareAppMessage() {
return {
title: \'自定义标题\', // 转发卡片标题
path: \'/pages/index?id=123\', // 跳转路径（可带参数）
imageUrl: \'/images/share.jpg\' // 自定义图片（可选）
};
}
});
5.2 朋友圈分享
Page({
onLoad() {
// 必须调用 updateShareMenu 开启朋友圈分享
wx.updateShareMenu({
menus: [\'shareAppMessage\', \'shareTimeline\']
});
},
// 定义朋友圈分享内容
onShareTimeline() {
return {
title: \'朋友圈标题\', // 仅朋友圈生效
query: \'id=123\', // 跳转参数（不同于 path）
imageUrl: \'/images/timeline.jpg\' // 朋友圈封面图
};
}
});
5.3获取群信息（getShareInfo)
Page({
onShareAppMessage() {
return {
title: \'分享到群聊\',
path: \'/pages/index?id=123\',
// 必须开启 withShareTicket 才能获取 shareTicket
success(res) {
const shareTicket = res.shareTickets[0]; // 获取 shareTicket
wx.getShareInfo({
shareTicket,
success(res) {
console.log(\'加密数据:\', res.encryptedData);
// 需后端解密获取 openGId（微信群的唯一标识）
}
});
}
};
}
});
注:
- onShareAppMessage和onShareTimeline是微信小程序原生提供的生命周期方法，专门用来自定义转发行为。
- onShareAppMessage(){return{title:\"\",path:\"\",imageUrl:\"/images/share.jpg\"}}用于定义转发内容，它可以设置转发到聊天时的标题、用户点击后跳转的路径、图片。
- onShareTimeline(){return{title:\"\",query:\"\",imageUrl:\"\"}}用于定义朋友圈内容，它可以设置分享到朋友圈的标题、跳转参数、图片。
5.4 完整示例
Page({
onLoad() {
// 1. 显示转发菜单，并开启朋友圈分享
wx.showShareMenu({
withShareTicket: true,
menus: [\'shareAppMessage\', \'shareTimeline\']
});
},
// 2. 定义转发到聊天内容
onShareAppMessage() {
return {
title: \'分享给好友\',
path: \'/pages/index?id=123\',
imageUrl: \'/images/share.jpg\',
success(res) {
if (res.shareTickets) {
// 3. 获取群信息（需后端解密）
wx.getShareInfo({
shareTicket: res.shareTickets[0],
success(res) {
console.log(\'加密数据:\', res.encryptedData);
}
});
}
}
};
},
// 4. 定义朋友圈分享内容
onShareTimeline() {
return {
title: \'分享到朋友圈\',
query: \'id=123\',
imageUrl: \'/images/timeline.jpg\'
};
}
});
5.5注意事项
①朋友圈分享需手动开启:
默认关闭，必须调用 `wx.updateShareMenu({ menus: [\'shareTimeline\'] })` 开启。
②shareTicket需后端解密:
wx.getShareInfo返回的是加密数据，需结合 session_key解密获取openGId
③所有分享必须用户触发:
不能自动弹出分享框，必须由用户点击按钮或菜单触发。
六、总结
- 转发类API（showShareMenu/ hideShareMenu/ updateShareMenu/ getShareInfo）用于控制转发菜单的显示和权限。
- 分享功能（onShareAppMessage/ onShareTimeline）用于 定义转发内容。
- 两者结合，可实现 动态控制转发、朋友圈分享、获取群信息等高级功能。
