Netlify 重定向或重写 Gatsby 通配符路径

Question

所以我已经在我的 gatsby-node.js 文件中实现了一个通配符路径：

exports.onCreatePage = async ({ page, actions }) => {
  const { createPage } = actions
  if (page.path.match(/^\/my-path/)) {
    page.matchPath = "/my-path/*"
    createPage(page)
  }
}

当我在本地运行站点（开发中）时，这工作正常。即，如果我提供 /my-path/anything123 或 /my-path/asdfasdfasdf，两者都会导致渲染我在 pages/my-path.tsx.

下的 Gatsby 项目中创建的组件

现在我们来解决我的问题。当我将我的站点部署到 Netlify 时，我没有得到与开发中相同的行为。像这样的行为可以在 Netlify 中通过重定向或重写来处理吗？我不想丢失 /my-path/ 之后的内容，因为实际上我正在使用它来解析 id，即如果 URL在浏览器中是 /my-path/123，我希望能够在 window.location.href 中看到 123，并在 my-path.tsx.

中用一些逻辑解析它

我希望这是清楚的。感谢任何能在正确的方向上帮助或指导我的人！

Answer 1

当然，写完这些之后，答案就很清楚了……我试过了，很管用！对于我提供的示例，以下重定向将在您的 netlify.toml 文件中起作用：

[[redirects]]
  from = "/my-path/*"
  to = "/my-path"
  status = 200
  force = true

所以它基本上必须将 1:1 与您在 gatsby-node.js 中定义的规则相匹配。

Netlify 重定向或重写 Gatsby 通配符路径

Netlify Redirect or Rewrite for Gatsby Wildcard Path

redirect

url-rewriting

reactjs

gatsby

netlify