微信小程序如何分享到朋友圈?

目前微信小程序不支持直接将小程序分享到朋友裂正圈，但好多人都是将小程序二维码分享到朋友圈中，同样可以达到这种效果，腾讯这块限制分享的原因是因为朋友圈广告，如果直接分享到朋友圈，在用户这块可能就不容易分清楚广告跟小程序

简书作者

2019-03-07 16:36

背景

业务场景需要在小程序内生成活动的分享海报，图片中的某些数据需动态展示。可行的方案有️二：

服务端合成：直接返回给前端图片URL

客户端陵源岁合成：客户端利用canvas绘制

客户端合成需要用到canvas，见这个网址，小程序canvas的尺睁那些事。客户端感觉很麻烦，要自己 *** 作canvas。

服务器端合成

我发现有人做了一个接口，输入服务器端的URL,直接返回一个图片，这样我就可以让前作做一个H5的页面，然后小程序中，直接得到这个图片然后分享到朋友圈。

下面是这个接口的小程序演示demo

打开开发者工具，在项目的pages文件夹下新建mypage文件夹，并在文件夹内新建mypage，在app.json中将mypage设为第一页面

请点击输入图片描述

在mypage.wxml中写代码如下：

<text>pages/mypage/mypage.wxml</text>

<button open-type='share'>分享</button>

请点击输入图片描述

做完第二步就已经实现了转发，默认title为当前小程序名称，path为当前页面的路径，imageUrl为当前页面的截图，如下图所示

请点击输入图片描述

4

为了实现更好的展示，可以再mypage.js中分享函数设置title及path，代码如下：

onShareAppMessage: function (res) {

if (res.from === 'button') {

}

return {

title: "真好",

path: 'pages/mypage/mypage'

}

}

请点击输入图片描述

5

编译代码，点击分享按钮，查看效宏念凯果如下图所示，有了设高塌置的title

6

如果传递的路径带参数需要在path中添加

*/

onShareAppMessage: function (res) {

if (res.from === 'button') {

}

return {

title: "真好",

path: 'pages/mypage/mypage?var='+data

}

}

7

当然要在接收的页面onload函数的options中获取参数

onLoad: function (options) {

options.data

},

END

经验内容仅供参考，如果您需解决具体问题(尤其法律、医学等领域)，建议您详细咨询相关领域专业人士。

作者声明：蔽唤本篇经验系本人依照真实经历原创，未经许可，谢绝转载。

小程序默认不能分享朋友圈，开发者需主动设置“分享到朋友圈”。页面允许被分享到朋友圈，需满足两个条件：

    首先，页面需设置允许“发送给枯弊衡朋友”。具体参考 Page.onShareAppMessage 接口文档

    满足条件 1 后，页面需设置允许“分享到朋友圈”，同时可自定义标题、分享图等。具体参考 Page.onShareTimeline 接口文档卜孝

满足上述两个条件的页面，可被分享到朋友圈。

### 条件1：（在js中添加onShareAppMessage）

onShareAppMessage: function (ops) {

    wx.showShareMenu({

      withShareTicket: true,

      menus: ['shareAppMessage', 'shareTimeline']

   没做 })

}

### 条件2：（在js中添加onShareTimeline）

  onShareTimeline: function () {

    return {

      title: '分享的标题',

      query: {

        // key: 'value' //要携带的参数

      },

      imageUrl: ''  //分享图,默认小程序的logo

    }

  },

### 点击小程序右上方三个点分享朋友圈，效果如下：

---