From 0399fd00ff5d2bb2ec259c26987387b0ca6e8858 Mon Sep 17 00:00:00 2001 From: Karlcarlo Date: Tue, 22 Sep 2026 21:52:16 +0800 Subject: [PATCH] =?UTF-8?q?wx-h5-demo:=20=E9=A1=B6=E9=83=A8=E6=96=B0?= =?UTF-8?q?=E5=A2=9E=E3=80=8C=E8=BF=94=E5=9B=9E=E9=A6=96=E9=A1=B5=E3=80=8D?= =?UTF-8?q?6=20=E4=B8=AA=E6=8C=89=E9=92=AE=20=E2=80=94=E2=80=94=20?= =?UTF-8?q?=E6=BC=94=E7=A4=BA=E8=BA=AB=E4=BB=BD=E6=80=8E=E4=B9=88=E5=B8=A6?= =?UTF-8?q?=E8=BF=87=E5=8E=BB=20(demo=20v26092201)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 按接入规范（box_app/docs/h5-auth-standard.md 第三节第 6 条同源身份缓存、 第五节第 6 条回首页不要裸跳）把这条路径做成可点的验证工具： ① goHome() —— 规范推荐，库自己带身份 ② 手拼 URL 带 openid/unionid —— 规范做法，身份放 query ③ 裸跳 /mama-box/（反例） —— URL 无身份；靠同源缓存兜底通常仍认得 ④ switchTab 回小程序首页壳 —— 宿主重新注入，最稳（仅 web-view 内） ⑤ 清同源缓存 + 裸跳 —— **复现线上 bug**：首页「身份不完整」且重试救不回 ⑥ 清同源缓存 + goHome() —— 证明 goHome 主动带身份、不依赖缓存 实现要点： - 卡片放在页面顶部（.env 那行之后）；新增一行只读展示 identity() 的 from/openid/unionid。 - ②③⑤ 用**同源相对地址**（location.origin + '/mama-box/'）：同源缓存本来就只在本 origin 有效，这样写与生产等价且可被其它挂载点复用；①⑥ 仍走库的 goHome()（绝对地址）——那正是要演示的 API。 - clearIdCache() 清完**不再**调 identity() 刷新展示：本页 URL 上还带着身份，"URL 优先"会立刻 写回缓存，等于白清（本地实测踩过，⑤ 因此复现不出来）。 - dbg() 已镜像 console.log：这些按钮点下去就跳走，页内面板看不到日志。 本地同源验证（/wx-h5-demo + /mama-box 同一 origin、桩后端）：②③⑥ 落地无「身份不完整」； ⑤ 落地**提示条 flex**（bug 复现）；① 走库的 goHome() 带 ?openid= 落地正常。页面无 JS 异常。 --- README.md | 19 ++++++++++ index.html | 103 ++++++++++++++++++++++++++++++++++++++++++++++++++++- 2 files changed, 121 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 3109a50..c068635 100644 --- a/README.md +++ b/README.md @@ -12,6 +12,25 @@ > 说明：场景2 的宿主页 `scenario2-host-page` 同时是场景1 授权后 redirectTo 的落地页（从 `globalData` 读结果拼 H5 url）。 +## 返回首页 · 身份怎么带过去（2026-09-22 新增，页面顶部那张卡） + +6 个按钮，用来验证「H5 返回首页」时身份怎么带过去、以及什么时候会丢： + +| 按钮 | 做法 | 预期落地表现 | +| --- | --- | --- | +| ① | `wxAuth.goHome()` | 首页**认得你**（库自己带上身份，规范推荐） | +| ② | 手拼 URL 带 `openid/unionid` | 首页**认得你**（规范做法；身份放 query） | +| ③ | 裸跳 `/mama-box/`（**反例**） | URL 上没身份，但**同源缓存兜底**通常仍认得你 —— 那是兜底生效，不是这条跳法对 | +| ④ | `wx.miniProgram.switchTab('/pages/index/index')` | 回**小程序首页壳**，由宿主重新注入身份（最稳，仅 web-view 内可用） | +| ⑤ | 清同源缓存 + 裸跳 | **复现线上 bug**：首页出现「身份不完整」提示条，且**点重试也救不回** | +| ⑥ | 清同源缓存 + `goHome()` | 仍**认得你**（`goHome` 主动带身份，不依赖缓存） | + +原理与硬约定见 `box_app/docs/h5-auth-standard.md` **第三节第 6 条**（同源身份缓存）与**第五节第 6 条**（回首页不要裸跳）。 +⚠️ 缓存写在 `sessionStorage['mmbox.identity']`，**只在本 origin 内有效**（本页与 mama-box 同在 `mp.yizhezhe.com`）； +外链域名的应用读不到，必须自己带身份。 +⚠️ 点下去就 `location.href` 跳走，**页内调试面板看不到日志**（随页面销毁）——`dbg()` 已镜像到 `console.log('[dbg]', …)`， +真机上看 console 或用上面的 `[wxAuth]` 日志。 + ## 文件 ``` wx-h5-demo/ diff --git a/index.html b/index.html index be32c6b..64ef373 100644 --- a/index.html +++ b/index.html @@ -48,6 +48,31 @@
wx-h5-demo 共享授权规范示例
环境：检测中… 纯浏览器
+ +
+

返回首页 · 身份怎么带过去（点哪个都要看首页认不认得你）

+
identity()—
+ + + + + + +

+ 要看的现象：① ② ⑥ 跳过去后首页应认得你（不出现「身份不完整」提示条、能拉到你的档案）； + ③ 是反例——它不带身份，但因为有同源缓存兜底（本页与 mama-box 同在 mp.yizhezhe.com， + 共享 sessionStorage）通常也能认出你；⑤ 清掉缓存后再裸跳就会露出「身份不完整」， + 而且点重试也救不回（重试只是重载同一条没有身份的 URL）—— 这就是线上那个 bug 的完整复现。
+ ⚠️ 缓存只是兜底不是许可：清微信缓存/换会话、或应用挂在外链域名下时就失效， + 所以跳转仍要按规范带身份（或调 goHome()）。
+ ⚠️ 「回首页」的目标是 mama-box 这个 H5 首页（H5 方式）；④ 是另一条路 —— 回小程序首页壳， + 由宿主重新注入身份，最稳但仅在小程序 web-view 内可用。
+ ⚠️ 身份放 query，别放 hash：部分应用自带 location.hash 路由，追加 hash 会被当成非法路由 + （规范第三节第 5 条）。 +

+
+

授权状态

检测中…

@@ -87,6 +112,8 @@ 小程序端独立授权页（头像/昵称/手机号，非 web-view 原生组件页）→ POST /api/mp/public/auth/profile 落库共享 UserAuth → 授权返回后宿主页更新 web-view src（hash 带结果）→ 本页重载 → wxAuth.readAuth() 显示。 「进商城」→ wx.miniProgram.switchTab('/pages/goods_cate/goods_cate')。 + 「返回首页」有 6 个按钮（页面顶部那张卡）：正路是 wxAuth.goHome() 或手拼 URL 带身份； + 其余是反例与降级演示 —— 用来验证同源身份缓存到底兜住了什么、什么时候会失效。

v
@@ -117,7 +144,7 @@ /* ============================================================ ① 页面版本号（YYMMDD + 两位序号）—— 用于排查 webview 是否缓存了旧页面 ============================================================ */ - var VER = 26091001; + var VER = 26092201; var verNoEl = el('verNo'); if (verNoEl) verNoEl.textContent = VER; @@ -361,6 +388,80 @@ dbg('🖱️ 点击「进商城」按钮'); wxAuth.goMall(); }); + + /* ============================================================ + 场景4 · 返回首页：三条正路 + 反例/降级（按钮在页面顶部那张卡） + ⚠️ 这些按钮点下去就 location.href 跳走了，**页内日志面板看不到**（它随页面销毁）—— + 所以关键信息同时进 console（dbg() 已镜像到 console.log('[dbg]', …)）， + 真机上用 vConsole / 开发者工具看 console 历史。 + ============================================================ */ + function identityTxt() { + if (!(wxAuth && wxAuth.identity)) return '(wx-auth.js 版本过旧，没有 identity() 方法)'; + var id = wxAuth.identity(); + return (id.openid || '(无)') + ' from=' + id.from + (id.unionid ? ' unionid=' + id.unionid : ''); + } + function refreshIdNow() { var n = el('idNow'); if (n) n.textContent = identityTxt(); } + function clearIdCache() { + try { + sessionStorage.removeItem('mmbox.identity'); + dbg('🧹 已清 sessionStorage[mmbox.identity]', 'ok'); + /* ⚠️ 清完**不要**再调 refreshIdNow()／identity() 去刷新上面那行 —— + 本页 URL 上还带着宿主注入的身份，"URL 优先"逻辑会立刻把它写回缓存， + 等于白清（本地实测踩过：⑤ 因此复现不出「身份不完整」）。这里只改文案。 */ + var n = el('idNow'); if (n) n.textContent = '(缓存已清空 · 跳转后不再有兜底)'; + } catch (e) { dbgErr('清缓存失败: ' + e.message); } + } + function jump(url) { try { location.href = url; } catch (e) { dbgErr('跳转失败: ' + e.message); } } + /* ②③⑤ 用**同源相对地址**：同源缓存本来就只在本 origin 内有效，这样写 + 既和生产等价（本页在 mp.yizhezhe.com/wx-h5-demo/），又能被本地/其它挂载点复用。 + ①⑥ 仍走库的 goHome()（绝对地址）—— 那正是要演示的 API。 */ + var HOME = location.origin + '/mama-box/'; + + el('btnHomeGo').addEventListener('click', function () { + dbg('🖱️ ① goHome()　跳转前 identity(): ' + identityTxt()); + dbg(' 预期：首页认得你（goHome 会自己带上身份）', 'ok'); + wxAuth.goHome(); + }); + el('btnHomeUrl').addEventListener('click', function () { + var id = (wxAuth && wxAuth.identity) ? wxAuth.identity() : { openid: '', unionid: '' }; + var q = id.openid + ? '?openid=' + encodeURIComponent(id.openid) + (id.unionid ? '&unionid=' + encodeURIComponent(id.unionid) : '') + : ''; + var u = HOME + q; + dbg('🖱️ ② 手拼 URL 带参数：' + (q ? u : '（identity() 为空，只能裸跳 → 会露出「身份不完整」）')); + dbg(' 预期：首页认得你', 'ok'); + jump(u); + }); + el('btnHomeBare').addEventListener('click', function () { + dbg('🖱️ ③ 裸跳（反例）：' + HOME); + dbg(' 预期：URL 无身份；若同源缓存里有（本页刚进来时存过）通常仍能认出你 —— 那是兜底生效，不是这条跳法对'); + jump(HOME); + }); + el('btnHomeSwitch').addEventListener('click', function () { + dbg('🖱️ ④ switchTab → /pages/index/index（小程序首页壳，宿主会重新注入身份）'); + if (window.wx && wx.miniProgram && wx.miniProgram.switchTab) { + wx.miniProgram.switchTab({ + url: '/pages/index/index', + fail: function (err) { dbgErr('switchTab fail: ' + ((err && err.errMsg) || '未知') + '（不在 web-view / 页面不存在）'); } + }); + } else { + dbgErr('不在小程序 web-view 内（window.wx.miniProgram 不存在），switchTab 不可用'); + } + }); + el('btnHomeBareClear').addEventListener('click', function () { + dbg('🖱️ ⑤ 清同源缓存 + 裸跳（**复现线上 bug 的那条路**）'); + clearIdCache(); + dbg(' 预期：首页出现「身份不完整」提示条，且点重试也恢复不了'); + jump(HOME); + }); + el('btnHomeClearGo').addEventListener('click', function () { + dbg('🖱️ ⑥ 清同源缓存 + goHome()'); + clearIdCache(); + dbg(' 预期：首页仍认得你（goHome 是主动带身份，不依赖缓存）', 'ok'); + wxAuth.goHome(); + }); + refreshIdNow(); + window.addEventListener('hashchange', refreshIdNow); }); })();