AuthContext.tsx 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. import React, { createContext, useContext, useEffect, useState } from 'react';
  2. import { 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: () => void;
  10. }
  11. const AuthContext = createContext<AuthContextType>({
  12. isLoggedIn: false,
  13. user: null,
  14. loading: true,
  15. refreshUser: async () => {},
  16. logout: () => {},
  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 refreshUser = async () => {
  22. try {
  23. const token = getToken();
  24. if (token) {
  25. const info = await getUserInfo();
  26. setUser(info);
  27. } else {
  28. setUser(null);
  29. }
  30. } catch (error) {
  31. console.error('获取用户信息失败:', error);
  32. setUser(null);
  33. }
  34. };
  35. const logout = () => {
  36. setUser(null);
  37. // 清除token在http服务中处理
  38. };
  39. useEffect(() => {
  40. const init = async () => {
  41. await refreshUser();
  42. setLoading(false);
  43. };
  44. init();
  45. }, []);
  46. return (
  47. <AuthContext.Provider
  48. value={{
  49. isLoggedIn: !!user,
  50. user,
  51. loading,
  52. refreshUser,
  53. logout,
  54. }}
  55. >
  56. {children}
  57. </AuthContext.Provider>
  58. );
  59. }
  60. export const useAuth = () => useContext(AuthContext);