前言:分享的主要作用就是推广,无论是转发给朋友、分享朋友圈、还是复制链接嵌入到公众号文章中去,都是宣传推广作用…

一,小程序自带的分享:【所有页面需要保证两个分享函数,和单独实现复制功能】
  • 发送给朋友(分享给好友 / 群聊) → 由 onShareAppMessage 处理
  • 分享到朋友圈 → 由 onShareTimeline 处理
  • 「复制链接」,并不是小程序官方 API 提供的能力,需要自己手动实现。

在这里插入图片描述

二、自定义分享格式,及分享朋友圈、复制链接【一键配置全局生效】

主要项目里页面多了,一开始给没用到函数都删了,客户说需要分享三件套的时候,又比较急情况下,只能使用通用配置设置所有页面都实现”分享三件套“

其中复制链接需要在隐私协议配置,否则无法通过审核,也无法正式环境使用,
在这里插入图片描述

三、进入正题

注意方法中定义的本地绝对路径图片就行,其他没了
在这里插入图片描述

1. 通用获取微信纯原生转发、分享、复制链接方法

// utils/shareManager.js
const DEFAULT_SHARE = {
  title: '峰力助听器', // 你的小程序名称
  imageUrl: '/img/share-default.jpg', // 必须是本地绝对路径!!!--网络图片或相对路径会导致分享菜单灰显。
};

export function initGlobalShare(pageConfig) {
  // 保存原始生命周期
  const originalOnLoad = pageConfig.onLoad;
  const originalOnShow = pageConfig.onShow;

  // 1. 在 onShow 中强制显示分享菜单(真机最稳定)
  pageConfig.onShow = function() {
    wx.showShareMenu({
      withShareTicket: true,
      menus: ['shareAppMessage', 'shareTimeline'],
      fail: (err) => {
        console.error('【真机】显示分享菜单失败:', err);
      }
    });
    originalOnShow && originalOnShow.call(this);
  };

  // 2. 全局转发给朋友(原生菜单触发)
  pageConfig.onShareAppMessage = pageConfig.onShareAppMessage || function() {
    const pages = getCurrentPages();
    const cur = pages[pages.length - 1];
    let params = '';
    if (cur.options) {
      params = Object.keys(cur.options).map(k => `${encodeURIComponent(k)}=${encodeURIComponent(cur.options[k])}`).join('&');
    }
    const path = `/${cur.route}${params ? '?' + params : ''}`;

    return {
      title: DEFAULT_SHARE.title,
      path: path,
      imageUrl: DEFAULT_SHARE.imageUrl,
    };
  };

  // 3. 全局分享到朋友圈(原生菜单触发)
  pageConfig.onShareTimeline = pageConfig.onShareTimeline || function() {
    const pages = getCurrentPages();
    const cur = pages[pages.length - 1];
    let params = '';
    if (cur.options) {
      params = Object.keys(cur.options).map(k => `${encodeURIComponent(k)}=${encodeURIComponent(cur.options[k])}`).join('&');
    }
    return {
      title: DEFAULT_SHARE.title,
      query: params,
      imageUrl: DEFAULT_SHARE.imageUrl,
    };
  };

  return pageConfig;
}

2.全局app.js中使用,给全页面注册使用

	import {
		initGlobalShare,
	} from './utils/share';

	//分享朋友圈、复制页面链接、将页面发送给朋友
	allPageShart_Copy_Forward() {
		// 重写 Page,所有页面自动注入
		const originPage = Page;
		Page = function (config) {
			return originPage(initGlobalShare(config));
		};
	},
	
	onLaunch() {
		this.allPageShart_Copy_Forward();
	}

3.结果

在这里插入图片描述
在这里插入图片描述

更多推荐