部署在 Netlify 上的 Gatsby 站点未更新来自 graphcms 的数据

Posted 2023-03-08

【中文标题】部署在 Netlify 上的 Gatsby 站点未更新来自 graphcms 的数据

【英文标题】：Gatsby site deployed on Netlify not updating data from graphcms

【发布时间】：2020-12-13 07:41:46

【问题描述】：

我是使用 Gatsby 和 graphcms 的初学者。使用 gatsby 开发环境从 cms 获取数据很好，一切都很好。我已经在 Netlify 上部署了我的网站，当通过 cms 添加一些新内容时，内容没有更新，也没有获取。

需要来自 cms 内容的组件：

import React from "react"
import  StaticQuery, graphql  from "gatsby"

import ServicesMobileProduct from "./ServicesMobileProduct"

const ProductsMobile = () => (
  <StaticQuery
    query=graphql`
      
        product 
          products 
            id
            productName
            description
            price
            amount
          
        
      
    `
    render=( product:  products  ) => (
      <>
        products.map(( productName, description, price, amount, id ) => (
          <ServicesMobileProduct
            key=id
            productName=productName
            description=description
            price=price
            amount=amount
          />
        ))
      </>
    )
  />
)

export default ProductsMobile

【问题讨论】：

因为 gatsby 是 STATIC 内容编译器......在构建（部署）之后它不会获取任何东西（几乎）......阅读 gatsby 文档关于构建/运行时获取......如果你需要一些动态元素（使用 RUN 时间获取）然后使用 apollo [就像在通常的 react webapp 中一样]

那么我该如何使用cms呢？部署后，我有时需要将新内容从 cms 添加到网站。

内容更新后只需重建/重新部署

这是否可以将其转换为动态内容，或者我必须将应用程序移动到简单的 React 应用程序？无法重建/重新部署每个更新，因为网站不适合我，而是适合已经需要网站的人。

重建过程可以自动化，更改后运行...出于 seo 原因，它应该是静态的...也许只有某些部分是动态的？

【参考方案1】：

Gatsby 是一个静态站点生成器，这意味着在构建/开发时它会从 CMS、markdown、JSON 或其他数据源收集所有数据，并在 /public 文件夹中创建公共 html 输出。或多或少遵循这个简化的架构：

一般来说，一旦网站建成后，您需要重新部署它以更新、创建或删除内容，因为网站并未使用这些 CMS 新更改进行更新。

您要实现的目标称为webhook。 Webhook 是应用程序在发生新事件时实时通知另一个应用程序的一种方式，例如我们创建、删除或修改源中的内容。

在 Gatsby 中，一些源（如 DatoCMS）公开了一个 webhook，但这仅适用于开发模式。任何 CMS 更改都会触发 gatsby develop 命令来刷新内容。当然，极不建议为了实现自动刷新而以gatsby develop模式实时上传网站。

在构建模式下，想法非常相似，但您需要触发gatsby build + 部署，而不是运行gatsby develop 命令。如果您使用任何持续部署工具 (CD)，例如 Netlify，您可以轻松实现这一点。如果您使用的是持续集成 (CI) 工具，例如 Jenkins，则需要配置管道来实现。

实现您想要的另一种方法是创建对外部 API 或数据源的异步 javascript 请求，以使用内容填充您的应用程序。这适用于任何环境，但您将失去 Gatsby 带来的所有 SEO 潜力（和其他潜力）。