仅在生产环境中，在 Gatsby 的动态路由中重新加载页面时出现 404

Question

这是我的 gatsby-node.js 代码

exports.onCreatePage = async ({ page, actions }) => {
    const { createPage } = actions;

    // Only update the `/blogs` page.
    if (page.path.match(/^\/blog/)) {
        // page.matchPath is a special key that's used for matching pages
        // with corresponding routes only on the client.
        page.matchPath = "/blog/*";

        // Update the page.
        createPage(page)
    }
}

这是我在博客页面上包含的路线。

 return (
        <Layout>
            <Router basepath="/blog">
                <BlogPage path="/" blogs={blogs} tags={tags} categories={categories}/>
                <BlogDetail path="/:slug" blogs={blogs} tags={tags.data}/>
                <Category path="/category/:category" blogs={blogs} tags={tags.data} categories={categories.data}/>
                <Category path="/tags/:tag" blogs={blogs} tags={tags.data} categories={categories.data}/>
                <Category path="/author/:author" blogs={blogs} tags={tags.data} categories={categories.data}/>
            </Router>
        </Layout>
    )

单击重定向时工作正常。但是，一旦页面加载并刷新，就会出现 404 错误。

我尝试了很多解决方案，但运气不好。

这是我的文件结构。

Answer 1

这是一个可能无法解决的已知问题。一种可能的解决方法是设置服务器端重定向。例如，如果您使用 netlify，您可以将其添加到您的netlify.toml：

[[redirects]]
  from = "/blog/*"
  to = "/blog"
  status = 200
  force = true