AuthContext.tsx 1.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172
  1. import React, { createContext, useContext, useEffect, useState } from 'react';
  2. import { clearToken, getToken } from '@/services/http';
  3. import { getUserInfo, UserInfo } from '@/services/user';
  4. interface AuthContextType {
  5. isLoggedIn: boolean;
  6. user: UserInfo | null;
  7. loading: boolean;
  8. refreshUser: () => Promise<void>;
  9. logout: () => Promise<void>;
  10. }
  11. const AuthContext = createContext<AuthContextType>({
  12. isLoggedIn: false,
  13. user: null,
  14. loading: true,
  15. refreshUser: async () => {},
  16. logout: async () => {},
  17. });
  18. export function AuthProvider({ children }: { children: React.ReactNode }) {
  19. const [user, setUser] = useState<UserInfo | null>(null);
  20. const [loading, setLoading] = useState(true);
  21. const [hasToken, setHasToken] = useState(false);
  22. const refreshUser = async () => {
  23. try {
  24. const token = getToken();
  25. setHasToken(!!token);
  26. if (token) {
  27. const info = await getUserInfo();
  28. setUser(info);
  29. } else {
  30. setUser(null);
  31. }
  32. } catch (error) {
  33. console.error('获取用户信息失败:', error);
  34. setUser(null);
  35. }
  36. };
  37. const logout = async () => {
  38. setUser(null);
  39. setHasToken(false);
  40. await clearToken();
  41. };
  42. useEffect(() => {
  43. const init = async () => {
  44. await refreshUser();
  45. setLoading(false);
  46. };
  47. init();
  48. }, []);
  49. return (
  50. <AuthContext.Provider
  51. value={{
  52. isLoggedIn: hasToken,
  53. user,
  54. loading,
  55. refreshUser,
  56. logout,
  57. }}
  58. >
  59. {children}
  60. </AuthContext.Provider>
  61. );
  62. }
  63. export const useAuth = () => useContext(AuthContext);