使用 gitlab-ci.yml 为部署在 azure 上的静态网站设置分支预览部署

Question

我在 azure 应用程序服务上部署了一个静态 Web 应用程序。这是我的 gitlab-ci.yml，用于生产中的 CI/CD -

variables:
  API_TOKEN: $DEPLOYMENT_TOKEN
  APP_PATH: '$CI_PROJECT_DIR'
  REACT_APP_ENV: $REACT_APP_ENV
  REACT_APP_GOOGLE_AUTH_CLIENT_ID: $REACT_APP_GOOGLE_AUTH_CLIENT_ID
  REACT_APP_OPENAI_API_KEY: $REACT_APP_OPENAI_API_KEY

deploy:
  stage: deploy
  image: registry.gitlab.com/static-web-apps/azure-static-web-apps-deploy
  script:
    - echo "App deployed successfully."

这对于我合并到 master 时的部署非常有用。

现在我想更新此 yml，以便在我在分支分支 master 上打开 PR 时也进行部署并创建预览 url。

如何更新此 yml 来做到这一点？

尝试过-

variables:
  API_TOKEN: $DEPLOYMENT_TOKEN
  APP_PATH: '$CI_PROJECT_DIR'
  REACT_APP_ENV: $REACT_APP_ENV
  REACT_APP_GOOGLE_AUTH_CLIENT_ID: $REACT_APP_GOOGLE_AUTH_CLIENT_ID
  REACT_APP_OPENAI_API_KEY: $REACT_APP_OPENAI_API_KEY

deploy:
  stage: deploy
  script:
    - apt-get update -qy
    - apt-get install -y nodejs npm
    - npm install
    - npm run build
    - curl -sL https://aka.ms/InstallAzureCLIDeb | bash
    - az --version
    - DEPLOYED_URL=$(az staticwebapp show --resource-group providentiainterviewbackend --name aihyr-prod-frontend --query "defaultHostname" -o tsv)
    - echo $DEPLOYED_URL
  environment: review/$CI_COMMIT_REF_SLUG
  only:
    - branches
  except:
    - master

它说我需要添加 az 登录。但是我不需要提供 az 登录凭据吗？有更好更简单的方法吗？

Answer 1

您可以利用 GitLab 的 CI/CD 环境变量以及 Azure Static Web Apps CLI 为从 master 分支派生的分支生成预览 URL，从而无需重复登录。并使用

az login

进行服务主体身份验证。确保在 GitLab CI/CD 设置中设置了

AZURE_CLIENT_ID

、

AZURE_CLIENT_SECRET

、

AZURE_TENANT_ID

和

AZURE_SUBSCRIPTION_ID

环境变量。这些值与您的 Azure 服务主体相关联。

variables:
  API_TOKEN: $DEPLOYMENT_TOKEN
  APP_PATH: '$CI_PROJECT_DIR'
  REACT_APP_ENV: $REACT_APP_ENV
  REACT_APP_GOOGLE_AUTH_CLIENT_ID: $REACT_APP_GOOGLE_AUTH_CLIENT_ID
  REACT_APP_OPENAI_API_KEY: $REACT_APP_OPENAI_API_KEY
  AZURE_CLIENT_ID:  c0c952e9-5254-45b5-b838-6d26a31435cb
 AZURE_CLIENT_SECRET:  snG8Q~c13XI06mOPVrqDWZaSTb6oFCl-LUD_Aavp
 AZURE_TENANT_ID:  83331f4e-7f45-4ce4-99ed-af9038592395
 AZURE_WEBAPP_NAME:  siliconfunc653

deploy:
  stage: deploy
  script:
    - apt-get update -qy
    - apt-get install -y nodejs npm
    - npm install
    - npm run build
    # Authenticate with Azure using the provided service principal
    - az login --service-principal -u $AZURE_CLIENT_ID -p $AZURE_CLIENT_SECRET --tenant $AZURE_TENANT_ID
    # Set Azure subscription
    - az account set --subscription $AZURE_SUBSCRIPTION_ID
    # Get the URL for the production deployment
    - DEPLOYED_URL=$(az staticwebapp show --resource-group providentiainterviewbackend --name aihyr-prod-frontend --query "defaultHostname" -o tsv)
    - echo "Production deployment URL: $DEPLOYED_URL"
    # Create preview URL for the branch
    - PREVIEW_URL=$(az staticwebapp hostname create --resource-group providentiainterviewbackend --name aihyr-prod-frontend --hostname $CI_COMMIT_REF_SLUG --branch $CI_COMMIT_REF_NAME --query "hostname" -o tsv)
    - echo "Preview deployment URL: $PREVIEW_URL"
  environment:
    name: review/$CI_COMMIT_REF_SLUG
    url: $PREVIEW_URL
  only:
    - branches
  except:
    - master

现在为我抛出无效租户 ID 错误。我使用的是从 azure 获得的正确租户 ID

为了解决此错误：-

确保您使用的

Tenant ID

变量是否正确，并且来自下面的此选项：-

它应该是连接到您的 Azure 订阅的目录的租户 ID。

确保您登录到正确的目录或切换到包含 Web 应用程序的订阅的正确目录。