从strapi获取数据到next.js,但响应延迟于API URL

问题描述 投票:0回答:1

我正在将数据从 Strapi 应用程序获取到我的 Next.js 应用程序。 我正在过滤和填充数据以按品牌获取数据并填充图像数据。

这是我的功能

getStrapiData()
:

async function getStrapiData(path: string): Promise<StrapiData> {
  const baseUrl = "http://127.0.0.1:1337"
  const productQuery = qs.stringify({
    populate: {
      images: {
        fields: ["url", "alternativeText"],
      },
    },
    product_tags: {
      fields: ["name"],
    },
    filters: {
      brand: {
        name: "bonux",
      },
    },
  })

  const url = new URL(path, baseUrl)
  url.search = productQuery

  console.log(url.href)
  try {
    const response = await fetch(url.href)
    const data = (await response.json()) as StrapiData
    console.log(data)
    return data
  } catch (error) {
    console.error(error)

    throw error
  }
}

export default async function Web() {
  const strapiData = await getStrapiData("/api/products")

我有两个console.log:

  1. console.log(url.href)
    将 URL 返回到 API,我可以在其中看到获取的产品
  2. console.log(data)
    返回数据响应

我不明白的是,两者之间的数据并不相似。在第 2 号中我仍然有以前的数据,在第 1 号中我仍然有修改后的新数据。

我不知道如何更好地解释它,因为我真的不明白以及如何调试它。

我在 console.log 1 的链接中看到的内容:

{
  "data": [
    {
      "id": 40,
      "attributes": {
        "name": "L’original",
        "hook": "L’iconique lessive en poudre Bonux revient, accompagné aujourd’hui de ses versions concentrées et en capsules",
        "precautions": "",
        "description": "",
        "createdAt": "2024-04-22T09:41:45.248Z",
        "updatedAt": "2024-04-22T16:17:10.701Z",
        "publishedAt": "2024-04-22T09:44:29.748Z",
        "strapiName": "L’original",
        "code_ean": null,
        "info": "",
        "images": {
          "data": [
            {
              "id": 625,
              "attributes": {
                "url": "/uploads/Type_Group_423_67d79b78eb.png",
                "alternativeText": "image product"
              }
            }
          ]
        }
      }
    }
  ],
  "meta": {
    "pagination": {
      "page": 1,
      "pageSize": 25,
      "pageCount": 1,
      "total": 1
    }
  }
}

我在console.log 2中看到的(我只放了简短版本):

    {
      data: [
        [
  {
    id: 8,
    attributes: {
      name: "Bonux Lessive concentrée L'Original (1,9L)",
      hook: 'Une valeur sûre pour la propreté de votre linge.',
      precautions: `<p><span style="font-size:12px;"><strong>MODE D'EMPLOI :</strong> 1 bouchon = 50 mL. À la main : doser 20 mL pour 5L d’eau, laver le linge et bien le rincer. Machine de 6-8Kg : Ajouter 25 à 30 mL au dosage prévu dans le tableau ci-contre.&nbsp;</span><br><br><img class="image_resized" style="width:66.74%;" src="/uploads/TABLEAU_DOSAGE_BONUX_3978673e18.png" alt="TABLEAU DOSAGE BONUX.png" srcset="/uploads/thumbnail_TABLEAU_DOSAGE_BONUX_3978673e18.png 245w, /uploads/small_TABLEAU_DOSAGE_BONUX_3978673e18.png 500w" sizes="100vw" width="500"><br><br><span style="font-size:12px;"><strong>PRÉCAUTIONS D’EMPLOI </strong>: Provoque une sévère irritation des yeux. Tenir hors de portée des enfants. Se laver soigneusement les mains après manipulation. Porter un équipement de protection des yeux. EN CAS DE CONTACT AVEC LES YEUX : Rincer avec précaution à l’eau pendant plusieurs minutes. Enlever les lentilles de contact si la victime en porte et si elles peuvent être facilement enlevées. Continuer à rincer. Si l’irritation oculaire persiste : consulter un médecin. EN CAS D'INGESTION : rincer la bouche. NE PAS faire vomir. Appeler immédiatement un CENTRE ANTIPOISON ou un médecin. En cas de consultation d’un médecin, garder à disposition le récipient ou l’étiquette. UFI : AX9N-FPD7-031Q-VKXD</span></p>`,
      description: `<p>Bonux revient en force avec sa lessive liquide L'Original fabriquée en France. Idéale pour le linge de toute la famille, elle offre une action nettoyante ultra- efficace, adaptée aux peaux les plus sensibles. Parfum longue durée aux notes subtilement fraîches !&nbsp;</p><p>Surprise ! Votre cadeau au dos de la bouteille !<br><br>&nbsp;</p><p><img class="image_resized" style="width:35.75%;" src="/uploads/VISUEL_AIRLABEL_SCORE_A_pour_facing_et_dos_de_pack_42c299dbc6.png" alt="VISUEL AIRLABEL SCORE A+ (pour facing et dos de pack).png" srcset="/uploads/thumbnail_VISUEL_AIRLABEL_SCORE_A_pour_facing_et_dos_de_pack_42c299dbc6.png 245w, /uploads/small_VISUEL_AIRLABEL_SCORE_A_pour_facing_et_dos_de_pack_42c299dbc6.png 500w, /uploads/medium_VISUEL_AIRLABEL_SCORE_A_pour_facing_et_dos_de_pack_42c299dbc6.png 750w, /uploads/large_VISUEL_AIRLABEL_SCORE_A_pour_facing_et_dos_de_pack_42c299dbc6.png 1000w" sizes="100vw" width="1000"> &nbsp;<img class="image_resized" style="width:42.77%;" src="/uploads/ac_label_complet_horizontal_2_etoiles_db8bea14a5.png" alt="ac-label-complet horizontal 2 étoiles.png" srcset="/uploads/thumbnail_ac_label_complet_horizontal_2_etoiles_db8bea14a5.png 245w, /uploads/small_ac_label_complet_horizontal_2_etoiles_db8bea14a5.png 500w, /uploads/medium_ac_label_complet_horizontal_2_etoiles_db8bea14a5.png 750w, /uploads/large_ac_label_complet_horizontal_2_etoiles_db8bea14a5.png 1000w" sizes="100vw" width="1000"></p><p><br><span style="font-size:12px;"><span style="mso-ansi-language:FR;mso-bidi-language:AR-SA;mso-fareast-font-family:Calibri;mso-fareast-language:EN-US;mso-fareast-theme-font:minor-latin;">Dangereux - Respecter les précautions d’emploi.</span></span></p><p>&nbsp;</p>`,
      createdAt: '2023-02-22T04:52:22.660Z',
      updatedAt: '2023-12-01T09:35:54.214Z',
      publishedAt: '2023-02-22T04:52:57.554Z',
      strapiName: "Bonux - Bonux L'Original liquide",
      code_ean: '3760360760392',
      info: `<p><strong><u>Qualités et caractéristiques environnementales de l'emballage :</u></strong></p><figure class="table" style="width:994pt;"><table class="ck-table-resized" style="border-collapse:collapse;" border="0" cellpadding="0" cellspacing="0" width="1320"><colgroup><col style="width:11.11%;"><col style="width:11.11%;"><col style="width:11.11%;"><col style="width:11.11%;"><col style="width:11.11%;"><col style="width:11.11%;"><col style="width:11.11%;"><col style="width:11.11%;"><col style="width:11.12%;"></colgroup><thead><tr style="height:29.0pt;" height="39"><th class="xl73" style="height:29.0pt;width:124pt;" height="39" width="165">Possibilité de réemploi</th><th class="xl73" style="border-left-style:none;width:121pt;" width="161">Rechargeabilité</th><th class="xl73" style="border-left-style:none;width:132pt;" width="175">Possibilité de compostage</th><th class="xl74" style="border-left-style:none;width:105pt;" width="139">Taux de recyclabilité</th><th class="xl77" style="width:101pt;" width="134">Mention recyclabilité</th><th class="xl76" style="border-left-style:none;width:103pt;" width="137">% de matières recyclées<span style="mso-spacerun:yes;">&nbsp;</span></th><th class="xl75" style="width:115pt;" width="153">% de Substances dangereuses<span style="mso-spacerun:yes;">&nbsp;</span></th><th class="xl73" style="border-left-style:none;width:101pt;" width="134">% de Perturbateurs endocriniens</th><th class="xl73" style="border-left-style:none;width:92pt;" width="122">Primes et pénalités</th></tr></thead><tbody><tr style="height:43.5pt;" height="58"><td class="xl78" style="border-top-style:none;height:43.5pt;width:124pt;" height="58" width="165">Emballage non réemployable</td><td class="xl78" style="border-left-style:none;border-top-style:none;width:121pt;" width="161">Emballage non rechargeable</td><td class="xl78" style="border-left-style:none;border-top-style:none;width:132pt;" width="175">Emballage non compostable</td><td class="xl79" style="border-left-style:none;border-top-style:none;width:105pt;" width="139">98,60%</td><td class="xl80" style="border-left-style:none;border-top-style:none;width:101pt;" width="134">Emballage entièrement recyclable</td><td class="xl78" style="border-left-style:none;border-top-style:none;width:103pt;" width="137">0</td><td class="xl78" style="border-left-style:none;border-top-style:none;width:115pt;" width="153">0</td><td class="xl78" style="border-left-style:none;border-top-style:none;width:101pt;" width="134">0</td><td class="xl78" style="border-left-style:none;border-top-style:none;width:92pt;" width="122">&nbsp;</td></tr></tbody></table></figure><p><strong><u>Qualités et caractéristiques environnementales du produit :</u></strong></p><figure class="table" style="width:468pt;"><table class="ck-table-resized" style="border-collapse:collapse;" border="0" cellpadding="0" cellspacing="0" width="623"><colgroup><col style="width:50%;"><col style="width:50%;"></colgroup><thead><tr style="height:29.0pt;" height="39"><th class="xl73" style="height:29.0pt;width:162pt;" height="39" width="215">% de Substances dangereuses<span style="mso-spacerun:yes;">&nbsp;</span></th><th class="xl74" style="border-left-style:none;width:306pt;" width="408">% de Perturbateurs endocriniens</th></tr></thead><tbody><tr style="height:43.5pt;" height="58"><td class="xl75" style="border-top-style:none;height:43.5pt;width:162pt;" height="58" width="215">0</td><td class="xl76" style="border-left-style:none;border-top-style:none;width:306pt;" width="408">Ne contient pas de substances PBT/vPvB ≥ 0,1 % évaluées conformément à l'annexe XIII du règlement REACH<span style="mso-spacerun:yes;">&nbsp;</span></td></tr></tbody></table></figure>`,
      images: {
        data: [
          {
            id: 615,
            attributes: {
              url: '/uploads/BONUX_LIQUIDE_L_ORIGINAL_3760360760392_49e4f45232.png',
              alternativeText: null
            }
          }
        ]
      }
    }
  },
  {
    id: 9,
    attributes: {
      name: "Bonux L'Original ",
      hook: "Le retour de l'iconique poudre Bonux.",
      precautions: "Mode d'emploi : \n" +
        "Verser la quantité (indiquée sur l'emballage du produit) dans le compartiment lessive de votre machine à laver (indiqué par le chiffre II).\n" +
        "Machine de 6-8kg : rajouter 30g au dosage prévu (se référer aux indications données sur l'emballage du produit).\n" +
        'Pour doser, utiliser une cuillère à soupe dédiée ou un gobelet gradué. \n' +
        "A la main : 2 cuillères à soupe = 30g + 5L d'eau tiède. \n" +
        "Recommandations d'usage : Ne pas utiliser sur la laine, le cachemire et la soie. Bien respecter les consignes de lavage des articles. Ne pas surdoser la machine. A utiliser à partir de 30°C.\n" +
        '\n' +
        '\n' +
        'Contient : Disilicate de sodium, Acide benzènesulfonique, dérivés alkyles en C10-13, sels de sodium ; Alcools C12-15 ramifiés et linéaires, éthoxylés.\n' +
        '\n' +
        "Précautions d'emploi : Provoque des graves lésions des yeux. Provoque une irritation cutanée. Tenir hors de portée des enfants. Se laver soigneusement les mains après manipulation. Porter un équipement de protection des yeux/du visage. Porter des gants de protection. EN CAS DE CONTACT AVEC LES YEUX : Rincer avec précaution à l'eau pendant plusieurs minutes. Enlever les lentilles de contact si la victime en porte et si elles peuvent être facilement enlevées. Continuer à rincer. Si l'irritation oculaire persiste, consulter un médecin. EN CAS D'INGESTION : rincer la bouche. NE PAS faire vomir. Appeler immédiatement un CENTRE ANTI-POISON ou un médecin. En cas de consultation d'un médecin, garder à disposition le récipient ou l'étiquette. Éliminer le récipient conformément à la réglementation locale.\n" +
        'UFI : 9DVE-N03H-R00M-VHEG',
      description: `<p>Bonux revient dans son format iconique : la lessive en poudre ! Bonux poudre L'Original est idéale pour un linge éclatant de blancheur. Son action détachante et sa formule active au bicarbonate vous garantit un lavage impeccable ! Sans conservateurs, elle est parfaitement adaptée aux peaux même les plus sensibles.<br>Surprise ! Votre cadeau dans la boîte !<br><br>&nbsp;</p><p><img class="image_resized" style="width:35.75%;" src="/uploads/VISUEL_AIRLABEL_SCORE_A_pour_facing_et_dos_de_pack_42c299dbc6.png" alt="VISUEL AIRLABEL SCORE A+ (pour facing et dos de pack).png" srcset="/uploads/thumbnail_VISUEL_AIRLABEL_SCORE_A_pour_facing_et_dos_de_pack_42c299dbc6.png 245w, /uploads/small_VISUEL_AIRLABEL_SCORE_A_pour_facing_et_dos_de_pack_42c299dbc6.png 500w, /uploads/medium_VISUEL_AIRLABEL_SCORE_A_pour_facing_et_dos_de_pack_42c299dbc6.png 750w, /uploads/large_VISUEL_AIRLABEL_SCORE_A_pour_facing_et_dos_de_pack_42c299dbc6.png 1000w" sizes="100vw" width="1000"> &nbsp;<img class="image_resized" style="width:42.77%;" src="/uploads/ac_label_complet_horizontal_2_etoiles_db8bea14a5.png" alt="ac-label-complet horizontal 2 étoiles.png" srcset="/uploads/thumbnail_ac_label_complet_horizontal_2_etoiles_db8bea14a5.png 245w, /uploads/small_ac_label_complet_horizontal_2_etoiles_db8bea14a5.png 500w, /uploads/medium_ac_label_complet_horizontal_2_etoiles_db8bea14a5.png 750w, /uploads/large_ac_label_complet_horizontal_2_etoiles_db8bea14a5.png 1000w" sizes="100vw" width="1000"></p><p><br><span style="font-size:12px;"><span style="mso-ansi-language:FR;mso-bidi-language:AR-SA;mso-fareast-font-family:Calibri;mso-fareast-language:EN-US;mso-fareast-theme-font:minor-latin;">Dangereux - Respecter les précautions d’emploi.</span></span></p><p>&nbsp;</p>`,
      createdAt: '2023-02-22T04:58:09.956Z',
      updatedAt: '2023-04-21T08:06:20.585Z',
      publishedAt: '2023-02-22T04:58:12.092Z',
      strapiName: "Bonux - Bonux L'Original poudre",
      code_ean: null,
      info: null,
      images: {
        data: [
          {
            id: 544,
            attributes: {
              url: '/uploads/BONUX_Lessive_Poudre_L_Original_2kg_409fa3101a.png',
              alternativeText: null
            }
          }
        ]
      }
    }
  },
...
      ],
      meta: { pagination: { page: 1, pageSize: 25, pageCount: 1, total: 4 } }
    }
javascript reactjs next.js strapi
1个回答
0
投票

默认情况下,Next.js 自动缓存

fetch
API 返回的值。 如果您希望数据始终是最新的,您可以通过添加无缓存选项来禁用缓存,如下所示:

fetch('https://...', { cache: 'no-store' })

有关更多详细信息,请参阅文档

© www.soinside.com 2019 - 2024. All rights reserved.