在React應用程式中存取YAML環境變量
P粉320361201
2023-08-30 20:02:17
<p>我正在開發一個 React 應用程序,它將部署在 3 個環境中。
開發/品質檢查和產品。 </p>
<p>Devops 團隊為我提供了一個包含環境變數的 YAML 文件,並要求我們在應用程式中使用這些變數。 </p>
<p>範例 YAML -</p>
<pre class="brush:php;toolbar:false;">---
apiVersion: apps/v1
labels:
app: kubesphere
component: ui-dev
tier: frontend
name: ui-dev
namespace: Test Project
spec:
matchLabels:
app: kubesphere
component: ui-dev
tier: frontend
template:
metadata:
labels:
app: kubesphere
component: ui-dev
tier: frontend
spec:
containers:
- env:
- name: BACKEND_URL
value: http://192.40.84.98:5656
image: $REGISTRY/$HARBOR_NAMESPACE/$APP_NAME:$IMAGE_VERSION-$BUILD_NUMBER
imagePullPolicy: Always</pre>
<p>我們必須存取的變數是 BACKEND_URL。 </p>
<p>我在我們的應用程式中將它們用作 - process.env.BACKEND_URL,但它不起作用。 </p>
<p>我有遺漏的嗎?請指導。 </p>
您無法從客戶端 JavaScript(瀏覽器)存取
process.env
在這種情況下它是反應。因此,即使容器具有該環境變量,JavaScript 也無法存取它。React 使用 env 變數的方式是,React 從
.env
檔案中讀取它們,然後在建置中 React 取得這些變數並將它們保留為 JavaScript 程式碼。在您的情況下,圖像(反應應用程式)已經構建,所以它不能 訪問容器中的那些環境變數..