[移动开发]微信小程序分享给朋友和分享到朋友圈

分享给朋友

微信小程序分享给朋友比较简单，只需要在要分享的页面中设置onShareAppMessage即可。

只有定义了此事件处理函数，右上角菜单才会显示“转发”按钮

监听用户点击页面内转发按钮（button 组件 open-type="share"）或右上角菜单“转发”按钮的行为，并自定义转发内容。

使用button分享
<button open-type="share">分享按钮</button>

?onShareAppMessage如果带了参数，参数中的from会指明是从哪里触发的，从按钮触发from='button'，从右上角菜单中触发from='menu'

onShareAppMessage: function (res) {
    //console.log('onShareAppMessage',res);
    return {
      title: '自定义标题',
      path: '/pages/index/index?userId='+Constant.userId+'&share=true',
    }
  },

//onShareAppMessage {from: "button", target: {…}}

支持自定义标题，自定义路径和自定义图片

?我们点击分享出去的卡片，打开小程序，可以在onLoad里获取path里的参数

onLoad(query) {
    console.log('onLoad',query);
}

//onLoad {userId: "1530474058280374273", share: "true"}

分享到朋友圈：

1、onShareTimeline监听右上角菜单“分享到朋友圈”按钮的行为，并自定义分享内容。

本接口为 Beta 版本，暂只在 Android 平台支持，iOS平台有的机型支持有的不支持

onShareTimeline: function() {
    return {
      title: '乐湃鲨自助台球',
      query: 'userId='+Constant.userId+'&storeId='+Constant.curStoreId+'&share=true',
    }
  }

事件处理函数返回一个 Object，用于自定义分享内容，不支持自定义页面路径，返回内容如下：

2、通过分享到朋友圈的内容打开小程序

?????? 用户在朋友圈打开分享的小程序页面，并不会真正打开小程序，而是进入一个“小程序单页模式”的页面，底部固定有操作栏，点击操作栏的“前往小程序”可打开小程序的当前页面。打开当前页面后，比如你分享的不是首页，你的顶部返回按钮又是一个公共的组件，都是返回上一级，你先通过分享的进入小程序，因为页面栈没有上一级，所以你是不能返回首页的，所以需要更改一下你的公共组件。

单页模式的介绍详见：分享到朋友圈 | 微信开放文档

“单页模式”默认运行的是小程序页面内容， “单页模式”下，一些组件或接口存在一定限制，可通过判断场景值等于 1154 的方法来进行页面适配。

补充：

单页模式下有很多限制，详情如下：

单页模式下的限制

小程序“单页模式”适用于纯内容展示场景，可实现的交互与接口能力有限，因此存在如下限制：

1. 页面无登录态，与登录相关的接口，如 wx.login 均不可用；云开发资源需开启未登录访问方可在单页模式下使用，详见未登录模式。
2. 不允许跳转到其它页面，包括任何跳小程序页面、跳其它小程序、跳微信原生页面
3. 不允许横屏使用
4. 若页面包含 tabBar，tabBar 不会渲染，包括自定义 tabBar
5. 本地存储与小程序普通模式不共用

对于一些会产生交互的组件或接口，在点击后调用时，会弹 toast 提示“请前往小程序使用完整服务”。为达到良好的用户体验，请注意适配单页模式的接口能力，请勿大量使用被禁用的接口或组件。

运营须知

分享朋友圈能力是为了满足纯内容场景的分享诉求，滥用于营销、诱导等行为将会被打击。

1. 小程序提供的服务中，不得存在滥用分享违规行为。如强制用户分享行为；分享立即获得利益的诱导行为；以及通过明示或暗示的样式来达到诱导分享目的的行为等。详见《微信小程序平台运营规范》
2. 在“单页模式”下，不得诱导或强制用户点击“打开小程序”，应在“单页模式”中尽可能呈现完整的内容

注意事项

1. 低版本微信客户端打开时，会进入一个升级提示页面
2. 不支持在小程序页面内直接发起分享
3. 自定义分享内容时不支持自定义页面路径
4. 存在 web-view 组件的页面不支持发起分享
5. 支持打开开发版、体验版，无权限人员进入时页面会提示无权限

?