微信小程序朋友圈分享后按钮全哑火，scene 1154 沙盒坑

活动页做了朋友圈分享功能，测试自己点"前往小程序"一切正常，信心满满上线。运营反馈说"从朋友圈打开，点按钮没反应"。回放路径：用户在朋友圈 feed 里点开分享卡片，页面渲染正常，"立即参与""抽奖""播放音乐"等按钮清晰可见，但点了毫无反应——静默失败，没有任何错误提示。

这不是代码 bug，是微信平台的沙盒机制在作祟。

现象

用户从朋友圈卡片进入小程序，页面视觉完全正常（轮播图、富文本规则、海报图均渲染）
所有交互按钮点击无任何响应：wx.navigateTo 静默失败，登录弹窗一闪而过，抽奖转盘纹丝不动
开发者工具正常调试无法复现；自己点"前往小程序"进去也无法复现
console.log 打印 wx.getLaunchOptionsSync().scene 输出 1154

根因

scene 1154 是微信为朋友圈信息流投放设计的只读单页预览态：

页面栈被锁定：wx.navigateTo / redirectTo / switchTab / reLaunch 全部被平台拦截，只有右下角「前往小程序」胶囊有效
交互 API 受限：wx.login、wx.getUserProfile、部分 wx.request 域名在此场景下静默返回错误
生命周期照常运行：onLoad / onShow 正常触发，代码正常跑，但一切依赖导航/登录/弹窗的逻辑都在沙盒里"空转"

直接后果是：按钮渲染了，但点了什么都干不了，用户体验等同于页面坏了。

坑：onShareTimeline 开启后必须主动适配 scene 1154

只要页面实现了 onShareTimeline()，就必须处理 scene 1154。不处理的结果不是"功能残缺"，而是页面看起来正常但所有按钮哑火，用户会误以为小程序故障。微信不会在 1154 下隐藏你的交互元素，这件事完全要自己做。

正解

在页面加载早期检测 scene，置 isSingleShare 标志位，WXML 用 wx:if 卸载所有交互元素，并增加引导提示。

1. 检测 scene，早期短路

// pages/activity/index.js
Page({
  data: {
    isSingleShare: false,
  },
 
  onShow() {
    const scene = wx.getLaunchOptionsSync().scene;
    if (scene === 1154) {
      this.setData({ isSingleShare: true });
      // 只加载展示类数据（活动配置/图片），不触发登录/弹窗
      if (!this._hasLoaded) {
        this._hasLoaded = true;
        this.loadActivityConfig(this._activityId); // 走无需登录的匿名读接口
      }
      return; // 阻断后续 login / 埋点 / 弹窗分支
    }
    // 正常流程
    this.checkLoginAndInit();
  },
});

用 getLaunchOptionsSync 而非 getEnterOptionsSync：单页模式下用户无法从其他页面返回，冷启动 scene 最稳定。

2. WXML 用 `wx:if` 卸载交互，不要用 `disabled`

<!-- 展示内容：两种模式都渲染 -->
<image src="{{heroImage}}" mode="aspectFill" />
<rich-text nodes="{{rulesHtml}}" />
 
<!-- 交互元素：单页模式下整块卸载 -->
<view wx:if="{{!isSingleShare}}" bindtap="onJoin">
  <button>立即参与</button>
</view>
<view wx:if="{{!isSingleShare}}" bindtap="onMusicToggle">音乐</view>
 
<!-- 引导提示：只在单页模式展示 -->
<view wx:if="{{isSingleShare}}" class="share-hint">
  请点击右下角「前往小程序」参与活动
</view>

用 wx:if 直接从 DOM 卸载，而不是 disabled 或 pointer-events: none。后者按钮依然可见可点，用户还会反复尝试，体验更差。

3. JS 所有 tap handler 加首行守卫（第二道防线）

WXML 是第一道墙；JS 加第二道，防止被间接触发：

onJoin() {
  if (this.data.isSingleShare) return;
  // ... 正常参与逻辑
},
 
onMusicToggle() {
  if (this.data.isSingleShare) return;
  // ...
},
 
_sendLotteryRequest() {
  if (this.data.isSingleShare) return; // 副作用函数也要守卫
  // ...
}

4. onShareTimeline 的 query 要带业务 ID

onShareTimeline() {
  const config = this.data.activityConfig;
  return {
    title: config.shareTitle || '默认标题',
    query: `activityId=${config.id}`,  // onLoad(options) 靠它渲染正确内容
    imageUrl: config.shareImage,
  };
}

1154 页面的 onLoad(options) 只能靠 query 拿到上下文，没有 activityId 就不知道渲染哪份配置，页面会空白。

正解：两道墙 + 只读引导

onShow 检测 scene 1154 → 置 isSingleShare = true → WXML wx:if 卸载交互元素 → JS handler 首行短路 → 展示「前往小程序」引导。展示类数据（图片/文案）仍正常加载，让页面有内容可看。

调试技巧

开发者工具 → 编译模式 → 新建自定义场景，scene 填 1154，即可在工具内模拟，不需要每次真机分享到朋友圈再点开。

注意：scene 1154 仅针对朋友圈单页模式，1044（他人转发卡片）、1007/1008（群/单聊卡片）进入的小程序不受只读限制，不要把它们一起拦截。

一句话外卖

实现了 onShareTimeline 就等于开了朋友圈单页只读沙盒入口，必须同步做 scene === 1154 检测 + 交互元素卸载，否则用户看到的是一个"按钮全部坏掉"的页面。