feat: 更新登陆和注册UI

src/views/Authentication/SignUp/SignUpIllustration.js

@@ -1,5 +1,5 @@
 // src\views\Authentication\SignUp/SignUpIllustration.js
-import React, { useState, useEffect } from "react";
+import React, { useState, useEffect, useRef } from "react";
 import {
     Box,
     Button,
@@ -51,6 +51,9 @@ export default function SignUpPage() {
     const navigate = useNavigate();
     const toast = useToast();
 
+    // 追踪组件挂载状态，防止内存泄漏
+    const isMountedRef = useRef(true);
+
     // 隐私政策弹窗状态
     const { isOpen: isPrivacyModalOpen, onOpen: onPrivacyModalOpen, onClose: onPrivacyModalClose } = useDisclosure();
 
@@ -95,10 +98,20 @@ export default function SignUpPage() {
 
         try {
             setIsLoading(true);
-            await axios.post(`${API_BASE_URL}/api/auth/${endpoint}`, {
+            const response = await axios.post(`${API_BASE_URL}/api/auth/${endpoint}`, {
                 [fieldName]: contact
+            }, {
+                timeout: 10000 // 添加10秒超时
             });
 
+            // 组件卸载后不再执行后续操作
+            if (!isMountedRef.current) return;
+
+            // ✅ 安全检查：验证 response 和 data 存在
+            if (!response || !response.data) {
+                throw new Error('服务器响应为空');
+            }
+
             toast({
                 title: "验证码已发送",
                 description: "请查收短信",
@@ -108,22 +121,36 @@ export default function SignUpPage() {
 
             setCountdown(60);
         } catch (error) {
-            toast({
-                title: "发送失败",
-                description: error.response?.data?.error || "请稍后重试",
-                status: "error",
-                duration: 3000,
-            });
+            if (isMountedRef.current) {
+                toast({
+                    title: "发送失败",
+                    description: error.response?.data?.error || error.message || "请稍后重试",
+                    status: "error",
+                    duration: 3000,
+                });
+            }
         } finally {
-            setIsLoading(false);
+            if (isMountedRef.current) {
+                setIsLoading(false);
+            }
         }
     };
 
     // 倒计时效果
     useEffect(() => {
+        let isMounted = true;
+
         if (countdown > 0) {
-            const timer = setTimeout(() => setCountdown(countdown - 1), 1000);
-            return () => clearTimeout(timer);
+            const timer = setTimeout(() => {
+                if (isMounted) {
+                    setCountdown(countdown - 1);
+                }
+            }, 1000);
+
+            return () => {
+                isMounted = false;
+                clearTimeout(timer);
+            };
         }
     }, [countdown]);
 
@@ -188,7 +215,17 @@ export default function SignUpPage() {
                 };
             }
 
-            await axios.post(`${API_BASE_URL}${endpoint}`, data);
+            const response = await axios.post(`${API_BASE_URL}${endpoint}`, data, {
+                timeout: 10000 // 添加10秒超时
+            });
+
+            // 组件卸载后不再执行后续操作
+            if (!isMountedRef.current) return;
+
+            // ✅ 安全检查：验证 response 和 data 存在
+            if (!response || !response.data) {
+                throw new Error('注册请求失败：服务器响应为空');
+            }
 
             toast({
                 title: "注册成功",
@@ -198,17 +235,23 @@ export default function SignUpPage() {
             });
 
             setTimeout(() => {
-                navigate("/auth/sign-in");
+                if (isMountedRef.current) {
+                    navigate("/auth/sign-in");
+                }
             }, 2000);
         } catch (error) {
-            toast({
-                title: "注册失败",
-                description: error.response?.data?.error || "请稍后重试",
-                status: "error",
-                duration: 3000,
-            });
+            if (isMountedRef.current) {
+                toast({
+                    title: "注册失败",
+                    description: error.response?.data?.error || error.message || "请稍后重试",
+                    status: "error",
+                    duration: 3000,
+                });
+            }
         } finally {
-            setIsLoading(false);
+            if (isMountedRef.current) {
+                setIsLoading(false);
+            }
         }
     };
 
@@ -220,6 +263,15 @@ export default function SignUpPage() {
         }
     };
 
+    // 组件卸载时清理
+    useEffect(() => {
+        isMountedRef.current = true;
+
+        return () => {
+            isMountedRef.current = false;
+        };
+    }, []);
+
     // 公用的用户名和密码输入框组件
     const commonAuthFields = (
         <VStack spacing={4} width="100%">