使用API React Hook防止多次令牌刷新

import { useState, useEffect } from 'react';

const useTokenRefresh = () => {
  const [refreshing, setRefreshing] = useState(false);

  useEffect(() => {
    const refreshToken = async () => {
      if (refreshing) return;

      setRefreshing(true);

      try {
        // 发起刷新令牌的请求
        const response = await fetch('/refresh-token', {
          method: 'POST',
          // 设置请求头，包含旧的令牌
          headers: {
            Authorization: `Bearer ${oldToken}`,
          },
        });

        if (response.ok) {
          // 刷新令牌成功，更新令牌
          const newToken = await response.json();
          // 更新令牌的逻辑，例如存储到本地或全局状态管理器中
          updateToken(newToken);
        } else {
          // 刷新令牌失败，处理错误逻辑
          handleError(response);
        }
      } catch (error) {
        // 处理网络请求错误
        handleNetworkError(error);
      }

      setRefreshing(false);
    };

    refreshToken();
  }, [refreshing]);

  return refreshing;
};

const App = () => {
  const refreshing = useTokenRefresh();

  return (
    <div>
      {refreshing ? '正在刷新令牌...' : '应用内容'}
    </div>
  );
};