【发布时间】:2020-01-16 22:25:10
【问题描述】:
我有一个 React 应用程序,它使用在构建步骤中准备的静态文件托管在 nginx 容器中。我遇到的问题是 API URL 然后被硬编码在 js 文件中,当我想将应用程序部署到不同的环境时遇到问题。
所以基本上我已经将带有 localhost API URL 变量的 config.js 文件放在公共目录中,然后将其加载到 index.html 文件部分的应用程序中。这适用于本地环境。当我想将它部署到测试或生产环境时,问题就来了。
我发现可以将 configMap 与卷挂载一起使用,但据我所知,这需要我提前为每个环境准备一个文件。我希望能够使用我在 Azure DevOps 库中设置的变量来填充 API URL 值。
所以我的问题是,是否有办法使用 Kuberentes/Helm 替换 nginx 容器中的 config.js 文件中的值,或者我是否可以使用 Azure DevOps 管道任务来替换 pre-准备好 config.js 文件并使用 Kubernetes 挂载它?
不确定我想要做什么是否清楚,但希望你能理解它......
config.js
window.env = {
API_URL: 'http://localhost:8080'
};
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>My application</title>
<!--
config.js provides all environment specific configuration used in the client
-->
<script src="%PUBLIC_URL%/config.js"></script>
</head>
...
【问题讨论】:
-
将应用程序配置与部署管道编排器紧密耦合并不是一个好主意。我个人会使用 configmaps。
-
你能详细说明为什么这不是一个好主意吗?
-
因为除了在该管道编排工具中创建和管理的管道之外,您无法运行可靠的部署。这使得在该工具的上下文之外进行测试变得困难,并且将来切换到不同的编排平台变得复杂。
-
好的,这很好。我想这样做的原因是能够在管道中更轻松地添加和删除环境,而无需更改任何代码。正如您所说,如果将应用程序移动到另一个编排平台,它将不会那么好。
-
可以知道这张票的进度吗?以下两种方法对您有实际帮助吗?如果没有,请不要犹豫,在下面发表评论。