在 Gatsby 中禁用客户端路由答案

【问题标题】：Disable Client Side Routing in Gatsby在 Gatsby 中禁用客户端路由
【发布时间】：2019-05-31 09:40:47
【问题描述】：

是否可以在 Gatsby 中禁用客户端路由？

我正在使用 Gatsby 生成一个静态站点，该站点只有一个页面，将从 AWS/S3 提供服务。我遇到了由 Gatsby 在页面和 Gatsby 运行时加载后从 URL 中删除对象后缀（https://s3.amazonaws.com/top-bucket/sub-bucket/index.html 变为 https://s3.amazonaws.com/top-bucket/sub-bucket/）引起的问题。如果我禁用 JavaScript，这个问题就不会发生，所以我很确定这是由 Gatsby 使用 React/Reach 路由器引起的。

有没有办法禁用这种行为？我知道我可能可以在 S3 上设置重定向来处理对存储桶的请求，但如果可能的话，我更愿意在应用程序级别执行此操作。

【问题讨论】：

你是如何从 gatsby 链接到那个 URL 的？
@DerekNguyen 我没有做任何链接。该网站是一个页面，没有任何导航。
我的错，我看错了你的帖子。你在用pathPrefix吗？我注意到它从我的网址中删除了 index.html 路径，但没有它我的资产会中断。如果您确实拥有它并将其关闭以解决问题，请考虑修改 webpack 配置以为您的资产添加 publicPath？
你也可能对这个插件感兴趣，虽然它不像你喜欢的那样在应用程序级别处理问题gatsbyjs.org/packages/gatsby-plugin-s3
@DerekNguyen 是的，我正在使用pathPrefix。我想知道为什么会导致这种行为？您是否有任何相关文档的链接？我猜如果我必须设置publicPath，我会做到的，onCreateWebpackConfig？

标签： amazon-s3 gatsby

【解决方案1】：

这是一个 hack，可能无法在其他任何人的应用程序中运行，也可能与 Gatsby 的未来版本中断，但我能够通过在 gatsby-browser.js 中设置 window.page.path = window.location.pathname; 来防止这种重定向。这使production-app.js 中的条件检查短路，它试图“使规范路径与实际路径匹配”并导致上面提到的（IMO）意外行为。

【讨论】：

正如预期的那样，这种解决方法在最近发布的 Gatbsy 后中断。请参阅 this 问题，其中涵盖了一些替代方法。

【解决方案2】：

这个问题已经很老了，但希望它对某人有所帮助，我使用了这个插件：https://github.com/wardpeet/gatsby-plugin-static-site

npm install @wardpeet/gatsby-plugin-static-site --save

只是在 gatsby-config.js 中添加了它

plugins: [{
  `@wardpeet/gatsby-plugin-static-site`,
}]

客户端路由随后被禁用！

【讨论】：