首页页面

src/components/authGuard.tsx

@@ -0,0 +1,63 @@
+import { useEffect, useState } from "react"
+import { Navigate, useLocation } from "react-router-dom"
+import { getProfile, refreshAuth } from "@/api/auth"
+
+export default function AuthGuard({ children }: { children: React.ReactNode }) {
+  const location = useLocation()
+  const [isValid, setIsValid] = useState<boolean | null>(null)
+
+  useEffect(() => {
+    const checkAuth = async () => {
+      const accessToken = localStorage.getItem("auth_token")
+      const refreshToken = localStorage.getItem("auth_refresh")
+
+      // 没 Token，判定无效
+      if (!accessToken && !refreshToken) {
+        setIsValid(false)
+        return
+      }
+
+      // 尝试用现有 AccessToken 获取用户信息
+      const profileResp = await getProfile()
+      if (profileResp.success) {
+        setIsValid(true)
+        return
+      }
+
+      // AccessToken 无效 尝试用 RefreshToken 刷新
+      if (refreshToken) {
+        const newTokens = await refreshAuth()
+        if (newTokens) {
+          setIsValid(true)
+          return
+        }
+      }
+
+      // 刷新失败或无 RefreshToken，为未登录
+      localStorage.removeItem("auth_token")
+      localStorage.removeItem("auth_refresh")
+      localStorage.removeItem("auth_expires_in")
+      setIsValid(false)
+    }
+
+    checkAuth()
+  }, [])
+
+  if (isValid === null)
+    return (
+      <div className="flex justify-center items-center h-screen">
+        验证身份中...
+      </div>
+    )
+
+  // if (!isValid) {
+  //   return (
+  //     <Navigate
+  //       to={`/login?redirect=${encodeURIComponent(location.pathname)}`}
+  //       replace
+  //     />
+  //   )
+  // }
+
+  return <>{children}</>
+}