[chore/frontend] call /auth/logout during logout
This commit is contained in:
parent
2c3e238e9a
commit
3d19ef05b3
2 changed files with 48 additions and 8 deletions
|
@ -61,17 +61,52 @@ const AdminLayout: FC<AdminLayoutProps> = () => {
|
|||
const location = useLocation();
|
||||
const navigate = useNavigate();
|
||||
const { theme, setTheme } = useTheme();
|
||||
const { user, loading, error } = useUser();
|
||||
const { user, loading, error, fetchUser } = useUser();
|
||||
|
||||
useEffect(() => {
|
||||
console.log('AdminLayout user:', user);
|
||||
console.log('AdminLayout loading:', loading);
|
||||
console.log('AdminLayout error:', error);
|
||||
}, [user, loading, error]);
|
||||
// 如果没有 token,重定向到登录页
|
||||
if (!localStorage.getItem('token')) {
|
||||
navigate('/admin/login');
|
||||
return;
|
||||
}
|
||||
|
||||
const handleLogout = () => {
|
||||
localStorage.removeItem('token');
|
||||
navigate('/admin/login');
|
||||
// 如果没有用户信息且没有在加载中,尝试获取用户信息
|
||||
if (!user && !loading && !error) {
|
||||
fetchUser();
|
||||
}
|
||||
|
||||
// 如果获取用户信息出错,可能是 token 过期,重定向到登录页
|
||||
if (error) {
|
||||
localStorage.removeItem('token');
|
||||
navigate('/admin/login');
|
||||
}
|
||||
}, [user, loading, error, navigate, fetchUser]);
|
||||
|
||||
const handleLogout = async () => {
|
||||
try {
|
||||
// 调用后端登出接口
|
||||
const token = localStorage.getItem('token');
|
||||
if (token) {
|
||||
await fetch('/api/v1/auth/logout', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Authorization': `Bearer ${token}`,
|
||||
},
|
||||
});
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('Logout error:', err);
|
||||
} finally {
|
||||
// 清除所有认证相关的存储数据
|
||||
localStorage.removeItem('token');
|
||||
localStorage.removeItem('username');
|
||||
|
||||
// 重置用户状态
|
||||
await fetchUser();
|
||||
|
||||
// 重定向到登录页
|
||||
navigate('/admin/login');
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
|
|
|
@ -4,6 +4,7 @@ import { FiUser, FiLock, FiSun, FiMoon, FiMonitor, FiGlobe } from 'react-icons/f
|
|||
import { useTranslation } from 'react-i18next';
|
||||
import { useTheme } from '../../hooks/useTheme';
|
||||
import { Menu } from '@headlessui/react';
|
||||
import { useUser } from '../../contexts/UserContext';
|
||||
|
||||
interface LoginFormData {
|
||||
username: string;
|
||||
|
@ -27,6 +28,7 @@ export default function Login() {
|
|||
const navigate = useNavigate();
|
||||
const { t, i18n } = useTranslation();
|
||||
const { theme, setTheme } = useTheme();
|
||||
const { fetchUser } = useUser();
|
||||
const [formData, setFormData] = useState<LoginFormData>({
|
||||
username: '',
|
||||
password: '',
|
||||
|
@ -66,6 +68,9 @@ export default function Login() {
|
|||
localStorage.removeItem('username');
|
||||
}
|
||||
|
||||
// 获取用户信息
|
||||
await fetchUser();
|
||||
|
||||
// 跳转到管理面板
|
||||
navigate('/admin');
|
||||
} catch (err) {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue