如何检测 Gatsby 是否为构建输出提供服务？答案

【问题标题】：How to detect that is Gatsby serving the build output?如何检测 Gatsby 是否为构建输出提供服务？
【发布时间】：2020-03-12 00:17:57
【问题描述】：

我想知道这是否可能以及如何检测运行的代码是否是由gatsby serve 提供的 gatsby 的build 输出。当我启动gatsby serve 时，浏览器会在localhost:9000/ 上打开，我需要根据某种环境变量或其他方式更改代码。我正在寻找最惯用的方法，如果可能的话，不要像阅读 window.location 对象这样的黑客攻击。提前致谢

【问题讨论】：

为了添加一些上下文，我问了这个问题，因为我使用 CookieBot 并启用了 data-blockingmode="auto" 属性。这仅适用于我在 cookiebot 上配置的域。作为免费计划，我只能设置一个域，因此我无法添加localhost:9000。作为 cookiebot 无法识别的域，当我运行 gatsby serve 时，所有 my/gatsby javascript 甚至都不会执行，因此在部署之前我无法真正看到生产构建是否正常工作。我花了 4 天时间才明白这个愚蠢的错误.. :(，而且基本上没有错误
这为我遇到的问题指明了正确的方向。谢谢你。

标签： build environment-variables gatsby production-environment

【解决方案1】：

当您gatsby build 时，Gatsby 会在您项目的 public 文件夹中创建您的项目的生产就绪版本。这意味着您可以获取public 文件夹并将代码部署到http 服务器。您无法从此代码“检测”任何特殊属性。 gatsby build 是 gatsby build。

我看到的唯一方法是在您gatsby serve 时检测到标准gatsby serve 端口号:9000 的使用。请参阅Mozilla docs。

您可以从 Gatsby 实现的reach/router API 获取location props。我不确定它是否实现了与 Mozilla 文档中提到的相同的方法。你应该试试这个。

const index = ({ location }) => {

  console.log(location.port);

  // ...
}

您也可以按照answer 中的说明解析 URL 字符串。

【讨论】：

感谢您花时间回复。是的，我知道构建文件夹是生产现场网站上的文件夹。您的解决方案也是我的想法，读取位置...我会稍等一下，看看 Gatsby 中是否内置了某种机制来检测 gatsby serve 正在运行，如果我没有得到任何其他响应我会将您的回复标记为正确答案。