t

微信授权重定向问题分析与修复.md

@@ -0,0 +1,121 @@
+# 微信授权重定向问题分析与修复
+
+## 问题描述
+微信授权回调成功后，虽然 `pendingRoute` 有正确的值，回调成功也能跳转到应该到达的页面（如 `promotionInquire`），但在加载该页面后，又会自动跳转到首页。
+
+## 根本原因分析
+
+### 问题 1: pendingRoute 清除时序错误 ❌
+**位置**: `src/App.vue` 第 69-72 行
+
+**原始代码**:
+```javascript
+if (pendingRoute) {
+    authStore.clearPendingRoute();  // ❌ 先清除
+    await router.replace(pendingRoute);  // 用已清空的 null 值跳转
+}
+```
+
+**问题**：
+- `clearPendingRoute()` 将 `authStore.pendingRoute` 设为 `null`
+- 之后 `router.replace(pendingRoute)` 使用的是已清空的 `null` 值
+- 导致实际跳转到 `undefined` 而非目标路由
+
+**修复**: 先跳转再清除 ✅
+
+### 问题 2: 路由守卫重复授权防护缺失 ❌
+**位置**: `src/router/index.js` 第 428-444 行
+
+**问题**：
+- 当用户在授权完成后，路由守卫再次执行时
+- 如果 `isWeChat.value && !isAuthenticated` 条件满足
+- 会重新触发授权流程，导致页面跳转
+
+**原因**: 
+- `authStore.isWeixinAuthing` 和 `authStore.weixinAuthComplete` 状态未被路由守卫检查
+- 虽然 token 已保存，但守卫仍可能因某些时序问题再次触发授权
+
+**修复**: 在路由守卫中增加授权状态检查 ✅
+
+### 问题 3: localStorage 同步问题
+**位置**: `src/stores/authStore.js`
+
+**问题**：
+- 清除 `pendingRoute` 时，可能只清除内存状态，localStorage 可能残留数据
+- 页面刷新时恢复的数据可能不完整
+
+**修复**: 确保内存和 localStorage 同步清除 ✅
+
+## 修复清单
+
+### ✅ 修复 1: App.vue 中的时序问题
+```javascript
+if (pendingRoute) {
+    // ✅ 先跳转
+    await router.replace(pendingRoute);
+    // ✅ 再清除
+    authStore.clearPendingRoute();
+}
+```
+
+### ✅ 修复 2: 路由守卫的防护检查
+在路由守卫中增加：
+```javascript
+if (isWeChat.value && !isAuthenticated && !isTokenExpired) {
+    // ✨ 新增：检查是否正在授权或已完成授权
+    if (authStore.isWeixinAuthing || authStore.weixinAuthComplete) {
+        console.warn("⚠️ WeChat auth already in progress or completed");
+        NProgress.done();
+        next();
+        return;
+    }
+    // ... 继续原有逻辑
+}
+```
+
+### ✅ 修复 3: authStore 中的日志和同步
+增强 `clearPendingRoute()` 和 `restoreFromStorage()` 方法的日志记录和错误处理。
+
+### ✅ 修复 4: PromotionInquire.vue 中的延迟处理
+添加延迟以确保页面完全加载后再进行任何路由跳转：
+```javascript
+function isFinishPayment() {
+    const query = new URLSearchParams(window.location.search);
+    let orderNo = query.get("out_trade_no");
+    if (orderNo) {
+        // ✨ 延迟 100ms 确保页面加载完成
+        setTimeout(() => {
+            router.push({ path: "/report", query: { orderNo } });
+        }, 100);
+    }
+}
+```
+
+## 调试建议
+
+### 观察日志的关键点：
+1. **微信授权开始**: 看是否出现 "Triggering WeChat auth from route guard"
+2. **Token 保存**: 看是否出现 "✅ Token saved successfully"
+3. **用户信息加载**: 看 "✅ User info fetched" 是否成功
+4. **pendingRoute 获取**: 看 "🎯 pendingRoute:" 后面的值
+5. **导航执行**: 看 "🚀 Navigating to pendingRoute:" 和 "✅ Navigated to pendingRoute"
+6. **是否重复授权**: 看是否出现 "⚠️ WeChat auth already in progress"
+
+### 测试步骤：
+1. 在微信中打开推广链接: `https://xxx.com/agent/promotionInquire/abc123`
+2. 观察控制台日志，确保看到上述所有成功日志
+3. 验证最终页面是 `promotionInquire` 而非首页
+
+## 修复文件列表
+- ✅ `src/App.vue` - 修复 pendingRoute 时序问题
+- ✅ `src/router/index.js` - 增强路由守卫防护
+- ✅ `src/stores/authStore.js` - 改进日志和同步
+- ✅ `src/views/PromotionInquire.vue` - 添加延迟处理
+
+## 总结
+这个问题是由多个时序和状态管理问题联合造成的：
+1. pendingRoute 被过早清除导致跳转失败
+2. 路由守卫缺少防护措施可能重复授权
+3. 状态同步不完整可能导致恢复失败
+
+通过修复这些问题，应该能够确保微信授权后正确重定向到目标页面。