微信小程序onShareTimeline()实现分享朋友圈

根据官方文档的意思，目前只支持Android版本

分享朋友圈官方链接

先上代码

Page({
	//页面的初始数据
	data:{
	},
	//自定义函数
	// 用户点击右上角分享给好友,要先在分享好友这里设置menus的两个参数,才可以分享朋友圈
	onShareAppMessage: function() {
		wx.showShareMenu({
	  withShareTicket: true,
	  menus: ['shareAppMessage', 'shareTimeline']
	 })
	},
	//用户点击右上角分享朋友圈
	onShareTimeline: function () {
		return {
	  title: '',
	  query: {
	  key: value
	  },
	  imageUrl: ''
	 }
	},
	//生命周期函数--监听页面加载
 onLoad: function(options) {
 },
})

写了这段代码后，刚加载页面时分享朋友圈是灰色的，我点击了分享好友后，才可以分享朋友圈?

把这段代码放到onLoad或者onReady中就可以了

wx.showShareMenu({
 withShareTicket: true,
 menus: ['shareAppMessage', 'shareTimeline']
})

兼容

小程序的功能不断的增加，但是旧版本的微信客户端并不支持新功能，所以在使用这些新能力的时候需要做兼容。开发者可以通过以下方式进行低版本的兼容：

版本号比较

微信客户端和小程序基础库的版本号风格为 Major.Minor.Patch（主版本号.次版本号.修订版本号）。

文档中会在组件，API等页面描述中带上各个功能所要求的最低基础库版本号。

开发者可以在小程序中通过调用 wx.getSystemInfo 或者 wx.getSystemInfoSync 获取到当前小程序运行的基础库的版本号。通过版本号比较的方式进行运行低版本兼容逻辑。

版本号比较适用于所有情况。部分场景下也可以使用后面提到的方法完成。

注意：不要直接使用字符串比较的方法进行版本号比较。

版本号比较可以参考以下代码：

// 比对是否是最新版本号
function compareVersion(v1, v2) {
 v1 = v1.split('.')
 v2 = v2.split('.')
 const len = Math.max(v1.length, v2.length)

 while (v1.length < len) {
 v1.push('0')
 }
 while (v2.length < len) {
 v2.push('0')
 }

 for (let i = 0; i < len; i++) {
 const num1 = parseInt(v1[i])
 const num2 = parseInt(v2[i])

 if (num1 > num2) {
  return 1
 } else if (num1 < num2) {
  return -1
 }
 }

 return 0
}

const version = wx.getSystemInfoSync().SDKVersion

if (compareVersion(version, '2.11.3') >= 0) {
 wx.openBluetoothAdapter()
} else {
 // 如果希望用户在最新版本的客户端上体验您的小程序，可以这样子提示
 wx.showModal({
 title: '提示',
 content: '当前微信版本过低，无法使用该功能，请升级到最新微信版本后重试。'
 })
}

版本号兼容官方链接

总结

到此这篇关于微信小程序onShareTimeline()实现分享朋友圈的文章就介绍到这了,更多相关小程序onShareTimeline()分享朋友圈内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

赞 (0)

相关推荐

  • 微信小程序实现分享到朋友圈功能

    微信小程序实现分享到朋友圈功能

    截止到2017年11月18号,微信小程序官方还尚未开放直接分享到朋友圈的能力,但是劳动人民的智慧是伟大的,现在普遍的做法是,生成一张带有小程序码的图片,保存到用户相册,用户自行发布图片到朋友圈 我的套路: 请求后端API生成小程序码(生成小程序码需要access token,后端生成比较方便) canvas绘制文字和图片到画布 当用户点击分享到朋友圈时,给用户展示画布,画布转成图片,并将图片保存到相册 onShow: function () { var that = this; //1. 请求后

  • 微信小程序实现分享朋友圈的图片功能示例

    本文实例讲述了微信小程序实现分享朋友圈的图片功能.分享给大家供大家参考,具体如下: 由于微信小程序只支持分享给朋友或者群,不支持分享到朋友圈,又有分享到朋友圈这个需求,那就要想办法实现这个需求.查阅各种资料,发现基本思路有两种,一种是后端实现,另一种是前端实现,后端实现的方式这里就不讨论了,因为我是不懂后端的,只会前端的东西,所以这里就记录一下前端的实现方法. 前端要实现分享到朋友群,都是通过canvas做一张图片,然后用户手动分享朋友圈.前端具体要做的就是把要分享的页面用canvas重做一遍,

  • 微信小程序通过保存图片分享到朋友圈功能

    微信小程序通过保存图片分享到朋友圈功能

    说明 首先说明一点,小程序内是不能直接分享到朋友圈的.所以只能通过生成图片,携带小程序二维码,保存到手机相册,让用户自己选择发到朋友圈.然后可以通过在小程序中识别二维码来进入小程序的指定页面.参考市面上支持分享的应用,基本都是这种实现方式. 准备阶段 1.通过服务器获取小程序码 这里可以参考下微信的官方文档,给后台指定的参数和路径等信息,让后台生成指定的小程序码.然后调用wx.getImageInfo将后台生成的小程序码保存起来. 注意一定要仔细看下微信的文档,如果生成小程序码的路径正式服务器不

  • 微信小程序通过一个json实现分享朋友圈图片

    微信小程序通过一个json实现分享朋友圈图片

    写在前面 最近在做小程序,发现制作分享到朋友圈图片是每个项目必须的.遇到坑比较多,写起来也比较繁琐,也没有找到类似组件,所以就自己动手写了一个. 演示 左侧是 canvasdrawer 绘制的,右侧是UI给的图 特性 简单易用 -- 一个 json 搞定绘制图片 功能全 -- 满足 90% 的使用场景 绘制文本(换行.超出内容省略号.中划线.下划线.文本加粗) 绘制图片 绘制矩形 保存图片 多图绘制 ... 代码量小 体验 git clone https://github.com/kuckboy

  • 微信小程序点击生成朋友圈分享图(遇到的坑)

    上个月boss交给我个微信小程序的活,告诉我只需要负责前端页面这块,问我多久做完,于是我不知天高地厚的说 一礼拜就能完工,哈哈哈,果然,现实总是那么无情的来打脸了...磨磨蹭蹭一共用了将近3个礼拜才算完事. 今天就来总结下遇到的各种坑好了~~~ 由于做的是仿照包你说的小程序,这里就借用包你说的截图好啦 (这个做出来是模拟器跟真机上都会显示生成的图片的,鬼知道是为啥..) 唔,不废话了,直接上代码好啦 A:wxml(一定要加上image标签,如果你没有加的话,那么即使图片生成了,在页面上也是不会显

  • 微信小程序实现canvas分享朋友圈海报

    本文实例为大家分享了微信小程序分享朋友圈海报的具体代码,供大家参考,具体内容如下 思路:生成朋友圈海报放在公共文件,首先需要绘制canvas,点击分享朋友圈按钮,在手机屏幕看不见的地方(定位left:1000px)绘制出canvas,绘制完成将canvas转为图片显示.点击保存按钮,将本地缓存路径的图片下载到手机相册,在这里需要进行授权处理 untils.js文件 // 参数说明: mainImg 商品图 headImg 微信头像 onshareImg 二维码 goodsName 商品名称 go

  • 微信小程序生成海报分享朋友圈的实现方法

    项目需求写完有一段时间了,但是还是想回过来总结一下,一是对项目的回顾优化等,二是对坑的地方做个记录,避免以后遇到类似的问题. 需求 利用微信强大的社交能力通过小程序达到裂变的目的,拉取新用户. 生成的海报如下 需求分析 1.利用小程序官方提供的api可以直接分享转发到微信群打开小程序 2.利用小程序生成海报保存图片到相册分享到朋友圈,用户长按识别二维码关注公众号或者打开小程序来达到裂变的目的 实现方案 一.分析如何实现 相信大家应该都会有类似的迷惑,就是如何按照产品设计的那样绘制成海报,其实当时

  • 微信小程序onShareTimeline()实现分享朋友圈

    微信小程序onShareTimeline()实现分享朋友圈

    根据官方文档的意思,目前只支持Android版本 分享朋友圈官方链接 先上代码 Page({ //页面的初始数据 data:{ }, //自定义函数 // 用户点击右上角分享给好友,要先在分享好友这里设置menus的两个参数,才可以分享朋友圈 onShareAppMessage: function() { wx.showShareMenu({ withShareTicket: true, menus: ['shareAppMessage', 'shareTimeline'] }) }, //用户

  • 微信小程序绘制图片发送朋友圈

    微信小程序绘制图片发送朋友圈

    本文实例为大家分享了微信小程序绘制图片发送朋友圈的具体代码,供大家参考,具体内容如下 这种生成图片的效果是很常见的,实现起来也不难,跟原生js的差不多.需要注意的就是canvas标签上不要加太多的css,后果呢就是导致canvas不显示,还有呢就是canvas组件的优先级是最高的,所以会覆盖掉下面的所有内容,解决方法呢就是使用: 使用上面这两个组件是可以盖在canvas上面的. 注意:canvas绘制不支持网络图片,需要将网络图片保存成本地图片 onLoad: function(options)

  • 微信小程序实现禁止分享代码实例

    这篇文章主要介绍了微信小程序实现禁止分享代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 微信禁止分享 添加以下代码到网页中即可 <script> document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() { // 通过下面这个API隐藏右上角按钮 WeixinJSBridge.call('hideOptionMenu'); // 通过下面这个AP

  • 微信小程序动态添加分享数据

    微信小程序动态添加分享数据

    微信小程序分享效果: js代码: page({ /** * 用户点击分享按钮或右上角分享 */ onShareAppMessage: function (res) { var that = this; return { title: that.data.common.act_name, desc: that.data.common.introduction, path: '/pages/xiangqing/xiangqing?id='+that.data.id, success: functio

  • 微信小程序前端自定义分享的实现方法

    微信小程序前端自定义分享的实现方法

    背景 目前手上有一个小程序的项目,希望转发时分享消息的界面能够自定义,然而微信小程序只提供设置图片的url和title. /** * 用户点击右上角分享 */ onShareAppMessage: function() { return { imageUrl:'', title:'' }; } 实现 我们要转发的显示内容多了一点东西:头像,用户名和点赞数.好在这个排版不是很复杂,所以我们思考了一下通过canvas去生成一张图片再return canvas所生成的图片url. 代码如下(其实还要作

  • 微信小程序实现页面分享onShareAppMessage

    效果 js let app = getApp(); Page({ data: { img: "/images/1.jpg" }, onLoad() { }, showShareMenu() { wx.showShareMenu(); console.log("显示了当前页面的转发按钮"); }, hideShareMenu() { wx.hideShareMenu(); console.log("隐藏了当前页面的转发按钮"); }, onShar

  • 微信小程序 wxapp导航 navigator详解

    微信小程序 wxapp导航 navigator 最近微信小程序非常火,朋友圈,微博,论坛等地方都在刷屏,因为这是搞前端的春天,前端工程师可以赚一把了,所以业余就学习了微信小程序的知识,这里记录下 : navigator 属性名 类型 默认值 说明 url String   应用内的跳转链接 redirect Boolean false 是否关闭当前页面 hover-class String navigator-hover 指定点击时的样式类,当hover-class="none"时,没

随机推荐