我测试react-query和SSR从nextjs预取数据只有当staleTime过去了。但是在测试之后，每20秒都会向API发出一个新的get请求，即使staleTime超过20秒。我真的不明白为什么这就是代码：

索引：

import { dehydrate, QueryClient, useQuery } from "@tanstack/react-query";
import Image from "next/image";
import axios from "axios";

type SpaceXData = {
  name: string;
  links: {
    patch: {
      large: string;
    };
  };
};

const getSpaceXData = async () =>
  await (
    await axios("https://api.spacexdata.com/v4/launches/latest")
  ).data;

export default function Page() {
  const { data } = useQuery<SpaceXData>(["spacex"], getSpaceXData);

  console.log(data);

  if (!data) return <h1>Error</h1>;

  return (
    <div>
      <h1>{data.name}</h1>
      <Image
        src={data.links.patch.large}
        alt="image"
        width={500}
        height={500}
      />
    </div>
  );
}

export async function getStaticProps() {
  const queryClient = new QueryClient();

  await queryClient.prefetchQuery(["spacex"], getSpaceXData, {
    staleTime: 30000,
  });

  return {
    props: {
      dehydratedState: dehydrate(queryClient),
    },
  };
}

_app.tsx：

import "tailwindcss/tailwind.css";

import type { AppProps } from "next/app";
import {
  QueryClient,
  QueryClientProvider,
  Hydrate,
} from "@tanstack/react-query";
import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
import React from "react";

function App({ Component, pageProps }: AppProps) {
  const queryClient = React.useRef(
    new QueryClient({
      defaultOptions: {
        queries: {
          refetchOnWindowFocus: false,
          retry: false, staleTime: 30000,

        },
      },
    })
  );

  return (
    <QueryClientProvider client={queryClient.current}>
      <Hydrate state={pageProps.dehydratedState}>
        <Component {...pageProps} />
      </Hydrate>
      <ReactQueryDevtools initialIsOpen={false} />
    </QueryClientProvider>
  );
}
export default App;

使用react-query devtools，我可以看到数据只有在30秒后才会过期，但在这30秒之间，一个请求完成，其他都是缓存请求。我尝试在axios请求上设置超时，但行为是相同的。也许是因为我有两个查询客户端，或者可能是下一个SSR正在进行重新验证。