我使用 Contentful 作为我的 CMS 和 NextJS 来显示我的内容。我的 NextJS 应用程序托管在 Vercel 上。我将 NextJS 13 与 AppRouter 一起使用。
问题是我不确定如何在 Contentful 上获取新内容以在 NextJS 上显示。
我尝试向 Contentful SDK 添加重新验证，但它导致内容无法加载。
并且在主页上导出 revalidate 不会执行任何操作。
当我发布新内容而不重新部署它时，如何让 NextJS 重建？我是 NextJS 的新手。
这是我的仓库:https://github.com/davinaleong/proj-laugh-and-be-blessed-next
最佳答案
您需要创建一个 webhook 以在每次内容更改时触发。
第 1 步:转到您的 Vercel 项目
第 2 步:访问项目设置 在 Vercel 仪表板中，导航至“设置”。您通常可以在顶部导航栏中找到它。
第 3 步:配置 Git 设置 在“设置”菜单中，单击左侧边栏中的“Git”。
第 4 步:向下滚动至部署 Hook
第 5 步:添加新的部署 Hook 单击“添加”按钮创建新的部署 Hook 。 为您的部署 Hook 命名(例如“Contentful Content Change”)。 指定要为其触发 Webhook 的分支名称。 点击“保存”。
第 6 步:复制 Webhook URL 保存后，您将看到为部署 Hook 生成的唯一 URL。将此 URL 复制到剪贴板。
第 7 步:返回内容
第 8 步:访问内容设置
第 9 步:配置 Webhook 在 Contentful 仪表板中，单击导航菜单中的“设置”，然后选择“Webhooks”。
第 10 步:添加新的 Webhook 在右侧，您将看到“Vercel 部署站点”。单击旁边的“添加”。
第 11 步:配置 Webhook 设置 为您的 Webhook 命名(例如“Contentful to Vercel”)。 将您在前面的步骤中从 Vercel 部署 Hook 复制的 URL 粘贴到 URL 字段中。 根据您的要求自定义 Webhook 设置。您可以选择针对特定内容事件触发它或根据需要应用其他过滤器。 单击“保存”保存您的 Webhook 设置。
第 12 步:大功告成!
您的 Webhook 现已设置为每次 Contentful 中的内容更改时触发，并与您的 Vercel 项目集成。 ✅ 这些说明应该可以帮助您无缝设置 Webhook。
您可以在“部署”选项卡中看到在 Contentful 中进行更改后触发的新构建。
关于vercel - Contentful 的新内容未显示在 NextJS 应用程序上，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/77206520/