ReactJs 环境变量形成 NestJS答案

【问题标题】：ReactJs Environment variables form NestJSReactJs 环境变量形成 NestJS
【发布时间】：2022-01-07 20:48:07
【问题描述】：

我们正在开发一个带有 NestJs 服务器端的 reactjs Web 应用程序。

目前我们使用ServeStaticModule.forRoot。

应用程序需要一些配置（例如分析服务器的 url、clientId、redirectUrl ...）。

由于 Create React App 不支持服务器渲染，我们在 HTML 中添加了占位符，并且我们希望向客户端注入变量。

例如：

<html lang="en">
  <head>
    <script>
      window.CONFIG = __CONFIG__;
    </script>

https://create-react-app.dev/docs/title-and-meta-tags#generating-dynamic-meta-tags-on-the-server

我们如何替换CONFIG？

【问题讨论】：

标签： reactjs environment-variables nestjs

【解决方案1】：

以下方法适用于 Express。

如果您想修改index.html，那么一种方法是在main.ts 中使用app.useStaticAsset(//build path, {index: false}) 来提供内容，而忽略index.html。然后就可以在根路径sendFile(//index.html path)投递页面了。

要替换占位符配置，您可以在各自的服务或控制器中使用 readFileAsync 之类的东西来读取 index.html 内容并在交付给客户端之前对其进行处理。

【讨论】：