# H5（reactH5）分享方案

与微信小程序 **拆分**：小程序依赖 `wx`、转发卡片、`onShareAppMessage`、`showShareMenu` 等；H5 仅能使用浏览器能力，**不提供**与小程序一致的分享卡片与朋友圈原生入口。

## 1. 设计原则

| 原则 | 说明 |
|------|------|
| 能力边界 | H5 只做 `navigator.share`、剪贴板、落地链接、可选 `document.title`；不假设微信 JS-SDK。 |
| 文案边界 | 不使用「右上角 ··· → 朋友圈」等仅小程序成立的引导；推广文案附 **可点击的 https 链接**。 |
| 代码边界 | 分享 URL 构建、系统分享/复制回退统一在 `src/utils/h5Share.ts`，页面只组参数与 Toast。 |

## 2. 用户可见的三条路径（阅读页）

1. **系统分享**：在支持的移动浏览器呼起原生分享面板（Web Share API）。  
2. **复制推广链接**：带 `id` / `mid` / `ref` 的当前站阅读 URL，便于私聊粘贴。  
3. **复制推广文案**：章节标题 + 后台配置的预览占比说明尾注 + **落地链接**（与小程序「搜小程序阅读全文」解耦）。

## 3. 与小程序的差异（产品说明）

- 小程序：**分享消息卡片**、可选缩略图、路径 `/pages/read/read`。  
- H5：**普通 URL**；在社交 App 内打开时预览依赖对方爬虫（本项目不在此做服务端动态 OG，仅可做前端 `document.title` 等轻量优化）。

## 4. 扩展占位

- 需在其它页面分享时：`import { buildReadShareUrl, shareOrCopyPageUrl } from '@/utils/h5Share'`。  
- 若将来在微信 **内置浏览器** 内接入 JSSDK，应单独模块 `wechatJssdkShare.ts`，**禁止**与 `h5Share` 混写，以免破坏非微信环境。