在生产中的浏览器中首次加载时，仅Gatsby客户端路径显示为404 [英] Gatsby client only paths is showing 404 on first load in browser in production

问题描述

我正在gatsby-node.js中创建我的动态页面以创建我的客户端路径。所有页面在本地主机中都运行良好，并且页面还显示了生产环境中所需的数据。但是，仍然是浏览器在第一次加载时将页面显示为404。我尝试了gatsby-node.js：

const path = require ("path")
exports.omCreatePage = async ({ page, actions }) => {
    const { createPage } = actions

    createPage({
       path: "/blog/id/slug",
       matchPath: "/blog/:id/:slug",
       component: path.resolve("src/components/Blogpage.jsx")
    })


    // Another try
    if (page.path.match(/^app/)) {
       page.matchPath = "/blog/:id/:slug"

       createPage(page)
    }

}

此外，我正在使用firebase hosting。我还尝试配置我的firebase.json文件进行重定向，如下所示：

{
  "hosting": {
     ...,
     "redirects": [
         {
            "source": "/blog/:id*",
            "destination": "/blog/:id/:slug",
            "type": 301
         }
     ]
  }
}

推荐答案

我有解决方案了！ 我需要做的就是，我必须在firebase.json文件中使用重写来定义我的博客页面：

{
  "hosting": {
     ...,
     "rewrites": [
         {
            "source": "blog/**",
            "destination": "/index.html"
         }
     ]
  }
}

它像护身符一样起作用。

这篇关于在生产中的浏览器中首次加载时，仅Gatsby客户端路径显示为404的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！