Nuxt3：Strapi 内容未在生产服务器上更新

Question

我目前正在开发一个前端使用 Nuxt3 的网站 (mbmobilesauna.de)。我的后端是 Strapi CMS。这两个站点在生产和开发中实际上都运行良好。旁注：我只参与 Nuxt 几个月。

我的问题：

我使用 Strapi 维护我的网站 (mbmobilesauna.de) 的内容。如果我现在更改 Strapi 中的内容，那么网站也会更新。到目前为止，这有效，但仅在 localhost 上，而不是在实际的生产 URL 上。

我的两个站点（前端、后端）托管在使用 Cloudflare 的服务提供商处。该服务提供商 100% 向我保证问题不在于 Cloudflare。 Cloudflare 仅缓存页面 4 小时，4 小时后内容应该会发生变化，但不幸的是事实并非如此。

对于我的前端项目，我有一个 Dockerfile 和一个 Deployment.yaml，一旦我提交新内容，它们就会自动发布我的项目。为了排除这个原因，我还在 Docker 容器中本地测试了所有内容。这里就有了所需的行为。一旦我在 Strapi 中更改某些内容，Docker 容器中的页面就会直接更新。

为了排除这是 Strapi 中的错误的可能性，我在本地开发环境中使用了 Strapi 生产 URL。

正如已经提到的，一切都在本地主机上完美运行。但是，一旦页面投入生产，内容就不再更新，除非我在前端管道中手动发布。 （这种行为是不希望的）

我尝试过的：

• 尝试另一个托管提供商（Netlify、Firebase）-在这里我在生产中再次遇到同样的问题。

• 尝试不同的浏览器（Chrome、Firefox、Opera）-同样的问题

• 停用缓存 - 又出现同样的问题

• 完全清除缓存-同样的问题

如何从 Strapi 获取数据：
nuxt.config.ts

  apollo: {
    clients: {
      default: {
        httpEndpoint: `https://STRAPI_PROD_URL/graphql`,
        browserHttpEndpoint: `https://STRAPI_PROD_URL/graphql`,
        connectToDevTools: false,
      },
    },
  },

index.vue

import gql from "graphql-tag";

const GET_HOMEPAGE = gql`
  query Homepage {
    homepage {
      data {
        id
        attributes {
          body {
            __typename
            ... on ComponentContentTypeCtLandingSection {
              id
              title
              landingDesc: description
              images {
                data {
                  id
                  attributes {
                    url
                    alternativeText
                  }
                }
              }
              link {
                id
                label
                url
                style
                unterseiten {
                  data {
                    id
                    attributes {
                      title
                      slug
                    }
                  }
                }
              }
            }
          }
        }
      }
    }
  }
`;

const { data }: any = await useAsyncQuery({
  query: GET_HOMEPAGE,
  cache: false
});

我使用 NuxtApollo (https://apollo.nuxtjs.org/) 和 GraphQL**

来处理我的请求

我在这里提供了完整的存储库以了解更多详细信息：**
https://github.com/Nirwana3301/SaunaFrontendNuxtStackoverflow

有人可以帮助我吗？

Answer 1

所以我遇到的问题100%是Apollo的。我使用 Nuxt/Strapi 模块 (https://strapi.nuxtjs.org/) 从 Strapi 中获取数据，一切都按照我想要的方式完美运行。

我仍然想知道为什么它不能与 Apollo 一起工作。

当我找到解决方案时，我将关闭该问题。然后我会在这里发布解决方案