Browse Source

refactor(auth): 优化登录后页面跳转逻辑

1. 新增工具函数处理URL鉴权token清理
2. 使用location.replace替代reload避免重复提交
3. 在全局认证提供者中自动清理URL中的token参数
feature/interaction
huangmin 1 month ago
parent
commit
a8baf19224
  1. 2
      src/components/auth/GlobalAuthProvider.tsx
  2. 4
      src/components/auth/LoginModal.tsx
  3. 25
      src/utils/authUrlToken.ts

2
src/components/auth/GlobalAuthProvider.tsx

@ -5,6 +5,7 @@ import { useSearchParams } from "next/navigation";
import { LoginModal } from "@/components/auth/LoginModal"; import { LoginModal } from "@/components/auth/LoginModal";
import { getStoredLoginToken, useUserStore } from "@/store/userStore"; import { getStoredLoginToken, useUserStore } from "@/store/userStore";
import { installAuthFetchInterceptor } from "@/utils/authFetch"; import { installAuthFetchInterceptor } from "@/utils/authFetch";
import { removeAuthTokenFromCurrentUrl } from "@/utils/authUrlToken";
export function GlobalAuthProvider({ children }: { children: ReactNode }) { export function GlobalAuthProvider({ children }: { children: ReactNode }) {
const searchParams = useSearchParams(); const searchParams = useSearchParams();
@ -18,6 +19,7 @@ export function GlobalAuthProvider({ children }: { children: ReactNode }) {
useEffect(() => { useEffect(() => {
if (queryToken) { if (queryToken) {
removeAuthTokenFromCurrentUrl();
setIsResolvingQueryToken(true); setIsResolvingQueryToken(true);
void fetchUserInfo(queryToken, { forceRefresh: true }).finally(() => { void fetchUserInfo(queryToken, { forceRefresh: true }).finally(() => {
setIsResolvingQueryToken(false); setIsResolvingQueryToken(false);

4
src/components/auth/LoginModal.tsx

@ -10,6 +10,7 @@ import {
PRIVACY_POLICY_KEY_PRIVACY_POLICY, PRIVACY_POLICY_KEY_PRIVACY_POLICY,
PRIVACY_POLICY_KEY_USER_TERMS, PRIVACY_POLICY_KEY_USER_TERMS,
} from "@/utils/openLatestPrivacyPolicyLink"; } from "@/utils/openLatestPrivacyPolicyLink";
import { getCurrentUrlWithoutAuthToken } from "@/utils/authUrlToken";
type LoginMode = "code" | "wechat" | "password"; type LoginMode = "code" | "wechat" | "password";
type CodePurpose = "login" | "wechat-bind"; type CodePurpose = "login" | "wechat-bind";
@ -114,7 +115,8 @@ export function LoginModal() {
} }
stopWxPoll(); stopWxPoll();
closeLoginModal(); closeLoginModal();
window.location.reload(); const newUrl = getCurrentUrlWithoutAuthToken();
window.location.replace(newUrl);
}, },
[closeLoginModal, fetchUserInfo, stopWxPoll, t] [closeLoginModal, fetchUserInfo, stopWxPoll, t]
); );

25
src/utils/authUrlToken.ts

@ -0,0 +1,25 @@
"use client";
const AUTH_TOKEN_QUERY_KEY = "token";
export function removeAuthTokenFromCurrentUrl(): string | null {
if (typeof window === "undefined") return null;
const url = new URL(window.location.href);
if (!url.searchParams.has(AUTH_TOKEN_QUERY_KEY)) {
return `${url.pathname}${url.search}${url.hash}`;
}
url.searchParams.delete(AUTH_TOKEN_QUERY_KEY);
const cleanedUrl = `${url.pathname}${url.search}${url.hash}`;
window.history.replaceState(window.history.state, "", cleanedUrl);
return cleanedUrl;
}
export function getCurrentUrlWithoutAuthToken(): string {
if (typeof window === "undefined") return "/";
const url = new URL(window.location.href);
url.searchParams.delete(AUTH_TOKEN_QUERY_KEY);
return `${url.pathname}${url.search}${url.hash}` || "/";
}
Loading…
Cancel
Save