Gatsby 盖茨比用动态页面覆盖静态页面(createPages)?

Gatsby 盖茨比用动态页面覆盖静态页面(createPages)?,gatsby,Gatsby,我们有一个用户平台项目。每个用户都有一个配置文件详细信息页(/{id}}),我们在使用createPages()构建的过程中创建了该页。当登录的用户对其配置文件进行更改时,这些更改将保留在数据库中,但在再次触发生成之前,这些更改对他来说将不可见。用户可能会认为他的更改已丢失,并且可能会感到沮丧。我们的理想解决方案是动态显示登录用户的配置文件 是否可以在同一url上用动态页面覆盖静态创建的页面?我们希望url保持不变(/{id}),因为用户将与其他用户共享他的链接 // Generation of

我们有一个用户平台项目。每个用户都有一个配置文件详细信息页(/{id}}),我们在使用createPages()构建的过程中创建了该页。当登录的用户对其配置文件进行更改时,这些更改将保留在数据库中,但在再次触发生成之前,这些更改对他来说将不可见。用户可能会认为他的更改已丢失,并且可能会感到沮丧。我们的理想解决方案是动态显示登录用户的配置文件

是否可以在同一url上用动态页面覆盖静态创建的页面?我们希望url保持不变(/{id}),因为用户将与其他用户共享他的链接

// Generation of static pages
exports.createPages = async function ({ actions, graphql }) {
  const { data } = await graphql(`
    query {
      apollo {
        allProfiles {
          email
          id
        }
      }
    }
  `)
  data.apollo.allProfiles.forEach((profile) => {
    const email = profile.email
    const id = profile.id
    actions.createPage({
      path: id,
      component: require.resolve(`./src/templates/profile-detail.js`),
      context: { email: email },
    })
  })
}

我认为对盖茨比的工作原理有误解。你的页面在内容上是静态的,但在JavaScript和React的逻辑上是动态的

您的页面当前是静态的,因为您在构建时填充组件/页面,但是,您需要向和端点发出API请求(例如,通过)以获取数据库中的更改,填充您的反应状态,并在JavaScript逻辑中显示/隐藏组件,而不是在服务器本身中


您的
/{id}
将保持完全相同,因为它是在
createPage
期间创建的,但您将根据用户的操作添加一个逻辑。

您完全正确。那天我的大脑一定在睡觉。我只是添加了逻辑来检测经过身份验证的用户是否正在访问自己的配置文件。根据这一点,它将具有不同的功能不同的逻辑。