عدم اجرای عمل fetch در Next.jsدر حالت پروداکشن

موضوع اینه که next علاقه زیادی به کش کردن داره! و اگر داده تغییر نداره، از کش استفاده میکنه. نوع کش رو برحسب نیاز مشخص کنین تا مشکلی نداشته باشین. تو ورژن ۱۴ و ۱۵ تغییراتی داشته که براساس اون طبق مستندات تعیین کنید.
تو ۱۵ اینطوریه:

fetch(`https://...`, { cache: 'force-cache' | 'no-store' })
fetch(`https://...`, { next: { revalidate: false | 0 | number } })

این لینک ها رو نگاه کن:
Data Fetching and Caching
fetch

درود بر شما @electera عزیز ❤️
ممنون از راهنماییت ، والا از پارامترای cache و revalidate استفاده کردم ، ولی همچنین لجبازی میکنه 😂
بذار کد رو بفرستم یه نگاه دقیق تری بکنی :

useEffect(() => {
        setLoaded(false)
        const fetchData = cache(async () => {

            const profe_token = localStorage.getItem("profe_token");

            if (profe_token) {
              const getUserByTokenRequest = await fetch("/api/user/get", {
                method: "POST",
                cache: "no-store",
                next: {
                  revalidate: false
                },
                headers: {
                    "Content-Type": "application/json"
                },
                body: JSON.stringify({ token: profe_token }),
              });

              const getUserByTokenResponse = await getUserByTokenRequest.json()

              if (getUserByTokenResponse.result == "ok") {
                const getProfeDataRequest = await fetch(`/api/profe/get`, {
                  method: "POST",
                  cache: "no-store",
                  next: {
                    revalidate: false
                  },
                  headers: {
                      "Content-Type": "application/json"
                  },
                  body: JSON.stringify({
                    profe_creator: getUserByTokenResponse.data.user_id
                  })
                });

                const getProfeDataResponse = await getProfeDataRequest.json()
                console.log("Profe",getProfeDataResponse);
                setProfeData(getProfeDataResponse)

                if (getProfeDataResponse.result == "ok") {

                  const getProfeSubscriptionRequest = await fetch(`/api/profe/subscription/get`, {
                    method: "POST",
                    cache: "no-store",
                    next: {
                      revalidate: false
                    },
                    headers: {
                        "Content-Type": "application/json"
                    },
                    body: JSON.stringify({
                        sub_owner: `${getProfeDataResponse.data.profe_id}`
                    })
                  });
                  const getProfeSubscriptionResponse = await getProfeSubscriptionRequest.json()
                  console.log("Profe Subscription",getProfeSubscriptionResponse);
                  setProfeSubscription(getProfeSubscriptionResponse)

                  const getProfeConnectionsRequest = await fetch(`/api/profe/connection/get_all`, {
                    method: "POST",
                    cache: "no-store",
                    next: {
                      revalidate: false
                    },
                    headers: {
                        "Content-Type": "application/json"
                    },
                    body: JSON.stringify({
                        connection_creator: `${getProfeDataResponse.data.profe_id}`
                    })
                  });
                  const getProfeConnectionsResponse = await getProfeConnectionsRequest.json()
                  console.log("Profe Connections",getProfeConnectionsResponse);
                  setProfeConnections(getProfeConnectionsResponse)

                  const getProfeThemeRequest = await fetch("/api/profe/theme/get", {
                      method: "POST",
                      cache: "no-store",
                      next: {
                        revalidate: false
                      },
                      headers: {
                          "Content-Type": "application/json"
                      },
                      body: JSON.stringify({ theme_id: `${getProfeDataResponse.data.profe_theme}` })
                  });

                  const getProfeThemeResponse = await getProfeThemeRequest.json();
                  console.log("Profe Theme",getProfeThemeResponse);
                  setProfeTheme(getProfeThemeResponse)

                  setLoaded(true)

                }

              }
              else {
                localStorage.removeItem("profe_token")
                window.location.href = "/connect"
              }

            }
        });

        fetchData();
    }, []);

اینجا اول بایستی توکن رو از طریق کوکی کاربر بگیره ، یوزر رو از طریق توکن بگیره و پروف ( به اصطلاح همون اکانت کاربر رو از طریق آیدی یوزر بگیره ) و بعد از گرفتن اطلاعات عمومی پروف ، مابقی موارد رو از طریق آیدی پروف دریافت کنه

حالا این مورد توی حالت development کاملا صحیح و بی مورده ، هر چند باری که URL صفحه رو تغییر بدم یا رفرش کنم بی مورد از اول تمام fetch ها رو انجام میده

حالا روی حالت production فرق میکنه ، بار اول وقتی سرور راه میوفته و صفحه لود میشه fetch میکنه و از دفعه بعد دیگه بیخیال fetch کردن میشه

( حالا من یه مورد دیگه ر و تست کردم ، یه پروژه جدید نکست ایجاد کردم و دقیقا همین روند رو دوباره پیاده سازی کردم :

"use client"

import Image from "next/image";
import styles from "./page.module.css";
import { useEffect } from "react";

export default function Home() {

  const fetchData = async() => {
    const request = await fetch("/api",{
      method: "POST",
      headers: {
        "Content-Type": "application/json"
      },
      body: JSON.stringify({
        token: "KIlnd88n3TTFEIK8nH2MswNwHmrPVEqR"
      }),
    })
    const response = await request.json()

    console.log(response);

  }

  useEffect(() => {
    fetchData()
  },[])

  return (
    <>
    Hello
    </>
  );
}

و همون روت ای پی آی پروژه قبلی ، اما اینبار روی پروداکشن هر رفرش یه دور fetch میکنه

البته اون خط کد که :

        const fetchData = cache(async () => {

رو فراموش کن اینجاش cache رو یادم رفت بردارم

و اینکه جالبی ماجرا اینه که توی بار دوم که fetch میکنه مثلا اون fetch اولی و دومی رو انجام میده بعد دیگه بقیه ش رو انجام نمیده

یا مثلا یادمه یه بار توی رفرش دوم مجدد fetch ها رو انجام داد یکی دو تای آخری رو انجام نداد

بنظرم مشکل از fetch یا cache نیست. کداتون اصولی نیست!
شما همه چیرو گذاشتی توی useEeffect و چندتا کار رو یکجا داری انجام میدی! چرا؟؟
بررسی توکن رو تو یک middleware تعریف کن که هر روتی نیاز داشت، راحت چکش کنی
علاوه بر اون شما داری از localStorage استفاده میکنی که امنیتش از کوکی و سشن بیشتره و میتونی نام کاربری، ایمیل یا شماره تلفن و حتی تم رو اونجا ذخیره کنی که نیاز نباشه مدام درخواست بفرستی و اینجوری فقط موقع درخواست از سرور بررسی کن توکن معتبره یا نه.
در نظر بگیر که useEffect بعداز رندر کامل کامپوننت اجرا میشه و باید درجای درست ازش استفاده کنی، بنظرم چندتا مقاله در مورد useEffect مطالعه کن. من خودم خیلی کم از useEffect استفاده میکنم و البته اگر روکرد اصولی باشه نیازی به استفادش نیست!!
سمپل های زیادی هست برای احراز هویت و.. هست مخصوصاً گیت هاب، نگاهی بنداز، میتونه بهت ایده بده.

سلام @electera عزیز
مرسی از پیشنهادات و پاسخت ❤️
والا دروغت نگم خیلی حرفه ای توی Next.js فعالیت نداشتم ، بیشتر تمرکزم رو این بود که اول پروژمو به یه سرانجام برسونم و بعدش با یادگیری یه سری از نکات مثل Middlewere و Authentication و چیزای مهم دیگه به زمانش یاد بگیرم
بعد اینکه در مورد موضوع useEffect ، والا برنامم این بود که توی فایل layout.js که قبل کامپوننت کلاینت قراره اجرا شه ، کار fetch رو انجام بدم و مقادیر رو پاس بدم به page.js که کامپوننت کلاینتم هست ، و اونجا ازش استفاده کنم ، ولی مشکل گرفتن توکن از داخل localStorage رو داشتم ، چرا که سرور کامپوننت فکر نکنم localStorage رو ساپورت کنه ، سر همین کار گرفتن دیتا رو از طریق localStorage و پاس دادن اون به api برای گرفتن دیتا انجام میدم
و تا چند روز پیش عملکرد fetch کردن خیلی خوب داشت کار میکرد ، اینکه راحت دیتا رو میگرفت و میشد ازش استفاده کرد ، از امروز اینجوری شده
اگر در مورد کش شدن دیتا ایده ای داری که یه جوری ردش کنم و بتونم توی هر بار لود ، دیتا رو با fetch بگیرم که ممنون میشم
برای پیشنهادات بالا هم ازت ممنونم ، کارسازه ❤️❤️❤️

یعنی برای گرفتن و قرار دادن اطلاعات کاربر میتونم به جای fetch های طولانی و تعداد بالا داخل کامپوننت از middleware استفاده کنم؟

آره راهش همونه. از اونجایی که تو نکست روتها اسم فولدرها هستن، تو لایوت middleware رو باید تعریف کنی.
توکن رو داخل کوکی بریزی بهتره، میتونی تاریخ انقضا بزاری و با رفرش توکن بروزش کنی. برای اینکه راحت بتونی state های مختلف رو بین کامپوننت ها به اشتراک بزاری از contex یا ریداکس استفاده کن که بنظرم همون useContex جواب کارتو میده.
در مورد کش شدن دیتا همونطور که گفتم بنظرم مشکل از fetch نیست، پیشنهاد میکنم ریکت رو عمیقتر مطالعه کنی و برای هر ابزاری که استفاده میکنی درمورش مقاله ها و مستنداتش رو مطالعه کنی مخصوصاً هوک ها.
در واقع احراز هویت و سطح دسترسی و خیلی موضوعات پایه رو نباید تو نکست زیاد درگیرش باشی!! بیشتر درگیری باید برای پیاده سازیش باشه و بهتره در ریکت حلش کنی چون اونجا به نسبت راحتتره و کلی سمپل براش هست.