uni-app微信分享需严格区分平台:小程序须页面级定义onShareAppMessage/onShareTimeline(强制共存),并配置三处开关;App/H5需uni.share+provider:'weixin',注意target限制与HTTPS直链要求。
uni-app 实现微信分享功能,核心在于区分「小程序环境」和「其他平台」——小程序里不能调用 uni.share 主动唤起,只能靠用户点击右上角或自定义按钮触发生命周期函数;而 app 或 h5 环境下必须用 uni.share,且依赖签名、权限、provider 配置等前置条件。搞混平台逻辑是 80% 分享失败的根源。
onShareAppMessage 和 onShareTimeline 必须页面级定义
这两个函数不是 methods 里的普通方法,也不能通过 mixin、App.vue 或 <script setup></script> 隐式注册。它们必须和 data、onLoad 平级,直接写在页面的 export default 对象里:
- ❌ 错误:放在
methods内部、用Vue.mixin注入、在setup()里只声明不挂载 - ✅ 正确:在
pages/index/index.vue的export default中直接写onShareAppMessage() { return { title: 'xxx', path: '/pages/index/index' } } - ⚠️ 注意:
onShareTimeline还额外要求同页面必须同时存在onShareAppMessage,否则朋友圈入口不显示(微信底层校验强制共存)
小程序朋友圈分享三处开关缺一不可
漏掉任意一项,右上角菜单里“分享到朋友圈”会静默消失,控制台无报错、开发者工具也不提示:
-
manifest.json→「App模块配置」→「Share(分享)」→ 勾选「微信分享」,并填对mp-weixin.appid -
pages.json→ 对应页面配置项中加"enableShareTimeline": true(不是enableShareAppMessage) - 微信公众平台后台 → 小程序「设置」→「功能设置」→ 手动开启「分享到朋友圈」开关(2026 年仍需人工开通)
uni.share 在 App/H5 环境下必须带 provider 且注意 target 限制
uni.share 在微信小程序里完全无效,但在 App 或 H5 微信浏览器中可用——但必须显式指定 provider: 'weixin',且 target 受限:
- App 端不支持
target: 'timeline'(朋友圈),传了也会 fallback 到好友分享 - H5 微信内嵌环境需先调用
wx.config完成 JS-SDK 初始化,url必须和当前完整地址(含 hash)一致,否则报config:invalid signature - 图片必须是 HTTPS 直链,
/static/xxx.jpg类路径在所有平台均无效;安卓微信 8.0.33+ 要求imageUrl≥ 300×300px,否则降级为灰色占位图
path 和 imageUrl 的硬性校验最容易被忽略
朋友圈卡片对字段极其敏感,多一个字段、少一个斜杠、空格没编码,都可能导致空白卡片或 404:
-
path只能是合法小程序路径,如/pages/detail/index;带参数必须用?key=value格式,中文/空格需encodeURIComponent处理 -
imageUrl必须是可被微信服务器直访问的 HTTPS 地址,本地路径、相对路径、HTTP 地址、CDN 回源失败链接全部无效 - 不支持
desc、thumb、success等扩展字段;title超过 48 字符会被截断,且无换行
最常被绕开的其实是「朋友圈只能由右上角触发」这个事实—— 永远不会唤起朋友圈,onShareTimeline 的 option 参数永远为空对象。想做差异化内容,得靠服务端动态生成不同 path 或 imageUrl,而不是前端判断来源。











