微信小程序 转发 分享功能(二)
关于小程序的转发:
最简单的就是点击小程序右上角菜单“转发”按钮直接分享,不过这种分享有点不太友好,实用性也不强。
当然,你可以自定义分享内容,包括标题,简介,图片及分享的小程序页面路径。
再高级一点,还可以对转发出去的小程序被二次打开的时候获取到一些信息。
一. 自定义转发内容:
onShareAppMessage(Obj):
/*** 用户分享自定义*/onShareAppMessage: function(res) {return {title: '哈根达斯冰激凌5折特惠',path: '/pages/index/index?goods_id=' + wx.getStorageSync("goods_id"),imageUrl: 'http://static.e-mallchina.com/pic/product/brand/detail/hgds.jpg'//自定义图片路径,可以是本地文件路径、代码包文件路径或者网络图片路径。支持PNG及JPG。显示图片长宽比是 5:4。}}
点击右上角菜单中的“转发”按钮,分享效果如下:
二. 点击页面按钮分享转发:
<button>
组件设置 open-type="share"即可实现页面内分享,点击按钮即可跟点击右上角菜单中的转发按钮会有一样的效果。
<button open-type='share' type='warn' size="mini" plain="true" id='btnShare0'>推荐给好友</button>
当然,跟右上角菜单中的转发按钮一样,如果设置了自定义转发内容,点击分享按钮也会展示自定义分享内容的。
三. 关闭分享功能:
/*** 生命周期函数--监听页面加载*/onLoad: function(options) {wx.hideShareMenu()},/*** 生命周期函数--监听页面显示*/onShow: function() {wx.hideShareMenu()},
四. 获取更多转发信息:
转发出去的小程序被二次打开的时候能够获取到一些信息,例如群的标识。
大致流程:
示例代码:
//分享页面设置开启分享群信息/*** 生命周期函数--监听页面加载*/onLoad: function(options) {wx.showShareMenu({withShareTicket: true})},/*** 生命周期函数--监听页面显示*/onShow: function() {wx.showShareMenu({withShareTicket: true})}
//app.js 获取小程序名片页附带的分享信息 App({onLaunch: function(ops) {//小程序在群里被打开后,获取情景值和shareTicketconsole.log("ops:", ops)if (ops.scene==1044) {wx.getShareInfo({shareTicket: ops.shareTicket,success:function(res) {console.log("wx.getShareInfo:::", res)}})}} })
分享到群里之后,在群里打开小程序,获取类似下面的数据:
如上图,获取的就是分享到的群聊的相关信息了,不过这个信息是加密的,需要像获取手机号一样再去后端解密才可以。
其中 encryptedData 解密后为以下 json 结构,详见加密数据解密算法。其中 openGId 为当前群的唯一标识:
{ "openGId": "OPENGID" }
经验证,这个功能只有在分享到群聊中才会有效,也就是说只能区分小程序是在群中还是好友聊天窗口中打开的,所以这个功能是比较鸡肋的。
五. 其他一些功能:
还有一个接口,就是更新转发属性的接口:wx.updateShareMenu(Object object),平常用的不多,感兴趣的可以自行去官网研究。
微信小程序 转发 分享功能(二)相关推荐
- 微信小程序 转发分享功能
转发 获取更多转发信息 通常开发者希望转发出去的小程序被二次打开的时候能够获取到一些信息,例如群的标识.现在通过调用 wx.showShareMenu 并且设置 withShareTicket 为 t ...
- 微信小程序---转发分享功能
1. 转发---onShareAppMessage 2.不带参数 //用户点击右上角分享 onShareAppMessage: function (res) {return {title: 'xxx' ...
- 微信小程序之分享功能
一.介绍 微信小程序的分享功能可以分享页面给朋友或群聊,但是不能分享到朋友圈,需要分享朋友圈的话,可以在小程序内设计一个分享页面,利用小程序提供的canvas把小程序码绘制到分享图里保存到本地分享到朋 ...
- 微信小程序/uniapp分享功能-代码封装与使用(分享好友或朋友圈-两种方式)
官方地址:分享 | uni-app官网 一.分享朋友圈-详见uni-app官方文档 注意:更多注意事项见uni-app文档 结果展示: 二.分享好友或者朋友圈-详见微信开放文档 先展示: 实现分享 ...
- 微信小程序转发 分享 打电话功能,完整代码附效果图
微信小程序开发交流qq群 581478349 承接微信小程序开发.扫码加微信. 正文: 按钮绑定在页面内发起转发事件onShareApp:(注意这里是button 并且给他设置了open-t ...
- unapp微信小程序转发分享、携带参数
一.第一种方式: // 开启小程序原生右上角分享按钮uni.showShareMenu({// https://developers.weixin.qq.com/miniprogram/dev/fra ...
- 微信小程序实现分享功能
@微信小程序 微信小程序如何实现分享功能 可能对于一些新入门的小程序开发者来说,开发一款小程序,想要推广,肯定希望有分享好友的功能,但是点击小程序右上角的三点按钮,发现发送给朋友的选项是灰色的.比如说 ...
- 微信小程序 - - - - - 转发分享(发送给好友、分享到朋友圈)
转发分享 1. 发送给好友 1.1 效果图: 1.2 实现步骤: 1.3 实现代码: 2. 分享到朋友圈 2.1 效果图: 2.2 实现步骤 2.3 实现代码: 3. 遇到的问题 3.1 分享到朋友圈 ...
- 微信小程序--实现分享功能
本篇文章的目标是实现分享小程序中的单张页面给其他用户,并且打开分享后的页面拥有返回按钮. 最终的效果: 1. 封装一个分享的组件 <view class='share'><view ...
最新文章
- 浅谈使用SQLBulkCopy批量数据入库
- centos7.0 安装nginx
- 利用 fdisk进行分区
- 【WebPPTtoPDF】在线将PPT转化为PDF,支持自定义排列方式
- Apache用户身份验证
- MyBatis-${}与#{}
- R语言中GCC编译的问题(续)
- react js清除浏览器缓存
- 常用自然语言处理NLP模型原理
- Unity换装系统实现
- 真没想到,vmware进入 bios设置 的方法是这样的
- 蹦迪--我的黑白玫瑰~!
- 利用高斯(Guass)算法求解2维的SVP向量
- 计算机毕业设计Java国漫论坛网站(源码+系统+mysql数据库+Lw文档)
- 直播网站是怎么实现的
- Java 的核心目的和并发编程
- Web Service与Rest API
- 前端学习从入门到高级全程记录之39 (PHP基础Ⅱ)
- Libuv 句柄优雅关闭
- SaToken技术分享文档