Azure static web 應用程序環境變量

Question

我正在嘗試通過 Azure Static web 應用程序發布 Gatsbyjs。 我有一個插件（gatsby-source-contentful）。

我需要傳遞變量，例如：

{
      resolve: `gatsby-source-contentful`,
      options: {
        spaceId: process.env.CONTENTFUL_SPACE_ID,
        accessToken: process.env.CONTENTFUL_ACCESS_TOKEN,
      },
},

錯誤：

Running 'npm run build'...


> gatsby-starter-default@0.1.0 build /github/workspace
> gatsby build

success open and validate gatsby-configs - 0.021s
error Invalid plugin options for "gatsby-source-contentful":

- "accessToken" is required
- "spaceId" is required
not finished load plugins - 0.905s

我在哪里可以通過這個？

謝謝。

Answer 1

它們被稱為環境變量。 它們旨在存儲敏感數據，例如令牌、標識符等，不應將它們推送到您的存儲庫中，因此您應該忽略它們（在您的.gitignore文件中）。

默認情況下，Gatsby 會在不通知您的情況下創建 2 個環境，每種編譯方法一個：

• gatsby develop ：使用.env.development
• gatsby build ：使用.env.production

注意：如果需要使用NODE_ENV自定義命令添加您自己的環境，您可以更改此行為。

因此，要將數據傳遞給gatsby-config.js ，您只需在項目的根目錄下創建兩個文件（ .env.development和.env.production ）。 然后，在gatsby-config.js的頂部添加以下代碼段：

require("dotenv").config({
  path: `.env.${process.env.NODE_ENV}`,
})

注意： dotenv已經是 Gatsby 的依賴，所以不需要重新安裝

這將告訴 Gatsby 在哪里獲取環境變量。

您只需要填充兩個環境文件即可。 在 Contentful 中查找憑據，並使用比您在gatsby-config.js中設置的合理命名將它們添加到文件中：

CONTENTFUL_SPACE_ID=123456789 
CONTENTFUL_ACCESS_TOKEN=123456789 

還要記住，在處理 Azure、Netlify、AWS 或類似的 CI/CD 工具時，您需要向服務器提供相同的環境文件，以避免在推送更改時出現代碼破壞。

Answer 2

對於 Azure Static Web 應用程序有兩種設置環境變量的方法，一種用於前端場景，一種用於后端場景。

由於您使用的是 Gatsby，我想假設您正在構建前端是安全的。 為此，您需要在構建配置 (azure-static-web-apps-.yml) 中添加環境變量。

像這樣：

env: # Add environment variables here
  CONTENTFUL_SPACE_ID: <your-id>

這是文檔中的鏈接。

不要與用於定義后端環境變量的這個混淆。