【问题标题】:Gatsby add dynamic page on client sideGatsby 在客户端添加动态页面
【发布时间】:2020-09-11 01:06:38
【问题描述】:

我正在使用 Netlify 上托管的 Gatsby 设置。

我正在构建某种食谱网站,用户可以在其中注册、登录并将食谱添加到他们自己的食谱页面。要添加新食谱,用户可以在表格中填写一些数据(如食谱名称、成分等)。提交时,数据将存储在数据库中。然后,我还希望为该特定配方创建一个动态页面。 (这就是你进来的地方)。

我知道我可以通过 gatsby-node.js 文件添加页面,但我希望此页面可以添加到客户端并且在表单提交后立即存在而不重建项目。这在盖茨比中是否可行?如果可以……如何?

如果这不可能,我最好的选择是在表单提交后调用 Netlify webhook 来重建项目,然后等待构建完成,然后才能显示配方详细信息页面?对此有什么想法吗?

希望你们中的一位程序员可以在这里帮助我!

【问题讨论】:

    标签: reactjs gatsby netlify


    【解决方案1】:

    好的,所以我发现 Gatsby 没有办法直接在客户端创建页面。我决定采用 Albert 的想法,即首先显示一个动态页面,其中包含一条消息,说这是一个临时页面,真正的食谱是“正在煮熟”。

    在提交表单时,我也只是简单地调用 webhook 来触发 Netlify 部署。这会触发新的部署,在 gatsby-node.js 中,我将根据表单提交时保存在数据库中的数据创建新页面。

    【讨论】:

      【解决方案2】:

      我的方法是首先显示新食谱页面的动态版本(在提交后直接),该页面仅对经过身份验证的用户可见(基于其用户 ID 和帖子 ID)。也许在该页面上注明作者清楚这一点。类似于:“这是一个预览。您的食谱正在制作中,几分钟后即可完成。”

      同时,将使用后端的 webhook 触发增量构建。 gatsby cloudnetlify 现在都支持这个,所以理论上构建应该很快。

      触发 webhook 取决于您未提及的后端解决方案。但是当使用例如 Drupal 时,您可以使用 build_hooks 模块。这可以配置为在配方回传到 Drupal 时触发构建。

      我确信会有许多技术挑战,但我认为这应该是可能的。诀窍是不要在新内容中生成太多依赖项,因此增量构建尽可能小。

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2014-02-24
        • 2021-08-22
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多