当我使用 Nuxtjs (SSR) 时，为什么我会在 devtools 的网络选项卡中看到我的请求

Question

我正在使用 nuxt 3.11.1，当我尝试从服务器端发送请求时，我仍然在网络选项卡中看到请求，这让我怀疑我是否正确发送了它们。

我编写了一个用于发送我的请求的可组合项，如下所示：

export async function useData(endpoint, params, method = "POST") {
  const authToken = useCookie("Authorization-Token");

  const options = {
    method,
    headers: {
      "Client-Token": import.meta.env.VITE_API_CLIENT_TOKEN,
      "Authorization-Token": authToken.value,
    },
  };

  if (method === "POST") {
    options.body = { ...params };
  }

  try {
    const response = await $fetch(
      `${import.meta.env.VITE_API_BASE_URL}/v1/${endpoint}`,
      options
    );

    return response;
  } catch (error) {
    throw error;
  }
}

在我的页面组件中，我尝试使用此可组合项，如下所示：

const authToken = useCookie("Authorization-Token");

if (authToken.value) {
  await useAsyncData(async () => {
    fetchData();
  });
}

async function fetchData() {
  try {
    const response = await useData("URL");
  }

如果 authToken 不存在，我会创建令牌并从客户端发送请求，但我还将令牌存储在 cookie 中并将其用于将来的请求。 一切正常，但我在网络选项卡中看到了我的所有请求。

Answer 1

您在客户端运行检查。试试这个

useAsyncData(async () => {
  if (authToken.value) {
    fetchData();
  }
});