授权示例: 非小程序webview时授权卡常驻提示「请在微信小程序中打开」(v26090808)

index.html

@@ -22,6 +22,7 @@
   .btn{display:block;width:100%;padding:15px;border:none;border-radius:14px;font-size:15px;font-weight:700;margin-top:14px;cursor:pointer}
   .btn.main{background:#F4593C;color:#fff} .btn.ghost{background:#fff;color:#6B615B;border:1px solid #EFE7E1}
   .hint{font-size:12px;color:#A79C95;margin-top:12px;line-height:1.6}
+  .env-hint{font-size:12.5px;color:#C4553A;background:#FBF0EE;border:1px solid #F0D8D2;border-radius:10px;padding:10px 12px;margin-top:12px;line-height:1.6}
   #toast{position:fixed;left:50%;bottom:14%;transform:translateX(-50%);background:rgba(30,22,18,.9);color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;opacity:0;pointer-events:none;transition:opacity .25s;z-index:99}
   #toast.show{opacity:1}
 
@@ -52,6 +53,7 @@
     <p id="authState" style="font-size:13px;color:#6B615B;line-height:1.6">检测中…</p>
     <button class="btn main" id="btnAuth" style="display:none">授权登录</button>
     <button class="btn ghost" id="btnMall">进商城</button>
+    <p id="envHint" class="env-hint" style="display:none">⚠️ 当前不是小程序 webview，无法完成授权登录。请在<strong>微信小程序</strong>里打开本页后使用（浏览器/微信内直开仅能查看）。</p>
   </div>
 
   <div class="card">
@@ -97,7 +99,7 @@
   /* ============================================================
      ① 页面版本号（YYMMDD + 两位序号）—— 用于排查 webview 是否缓存了旧页面
      ============================================================ */
-  var VER = 26090807;
+  var VER = 26090808;
   var verNoEl = el('verNo');
   if (verNoEl) verNoEl.textContent = VER;
 
@@ -216,6 +218,7 @@
       var envTxt = a.inWebview ? '小程序 web-view' : (a.MODE === 'wechat-browser' ? '微信浏览器' : '纯浏览器');
       dbg('init 回调: envTxt=' + envTxt + '  MODE=' + a.MODE + '  inWebview=' + a.inWebview, 'ok');
       el('envTxt').textContent = envTxt;
+      el('envHint').style.display = a.inWebview ? 'none' : 'block';
       render(a);
     });
   }