Использование рабочего процесса GitHub Actions для развертывания статического веб-сайта в службе хранилища Azure

Статья
02/25/2025

Начните работу с GitHub Actions, используя рабочий процесс для развертывания статического сайта в учетной записи хранения Azure. После настройки рабочего процесса GitHub Actions вы сможете автоматически развертывать сайт в Azure из GitHub при внесении изменений в код сайта.

Примечание.

Если вы используете Статические веб-приложения Azure, то вам не нужно вручную настраивать рабочий процесс GitHub Actions. Статические веб-приложения Azure автоматически создают рабочий процесс GitHub Actions.

Необходимые компоненты

Подписка Azure и учетная запись GitHub.

Учетная запись Azure с активной подпиской. Создайте учетную запись бесплатно .
Репозиторий GitHub с кодом статического веб-сайта. Если у вас нет учетной записи GitHub, зарегистрируйте ее бесплатно.
Рабочий статический веб-сайт, размещенный в службе хранилища Azure. Узнайте, как разместить статический веб-сайт в службе хранилища Azure. Для выполнения этого примера следует также развернуть Azure CDN.

Примечание.

Обычно сеть доставки содержимого (CDN) используется для уменьшения задержки в работе пользователей по всему миру и уменьшения количества транзакций в учетной записи хранения. Развертывание статического содержимого в облачной службе хранилища может снизить потребность в потенциально дорогостоящем вычислительном экземпляре. Дополнительные сведения см. в разделе Шаблон размещения статического содержимого.

Создание учетных данных для развертывания.

OpenID Connect
Субъект-служба

Чтобы использовать действие входа Azure с OIDC, необходимо настроить федеративные учетные данные удостоверения в приложении Microsoft Entra или управляемом удостоверении, назначаемом пользователем.

Вариант 1. Приложение Microsoft Entra

Создайте приложение Microsoft Entra с субъектом-службой, портал Azure, Azure CLI или Azure PowerShell.
Скопируйте значения для идентификатора клиента, идентификатора подписки и идентификатора каталога (клиента), чтобы использовать его позже в рабочем процессе GitHub Actions.
Назначьте соответствующую роль субъекту-службе, портал Azure, Azure CLI или Azure PowerShell.
Настройте учетные данные федеративного удостоверения в приложении Microsoft Entra для доверия маркеров, выданных GitHub Actions в репозитории GitHub.

Вариант 2. Управляемое удостоверение, назначаемое пользователем

Создание управляемого удостоверения, назначаемого пользователем.
Скопируйте значения для идентификатора клиента, идентификатора подписки и идентификатора каталога (клиента), чтобы использовать его позже в рабочем процессе GitHub Actions.
Назначьте соответствующую роль управляемому удостоверению, назначенному пользователем.
Настройте учетные данные федеративного удостоверения в управляемом удостоверении , назначаемом пользователем, для доверия маркеров, выданных GitHub Actions в репозитории GitHub.

Необходимо указать идентификатор клиента приложения, идентификатор каталога (клиента) и идентификатор подписки для действия входа. Эти значения могут быть указаны непосредственно в рабочем процессе или храниться в секретах GitHub с указанием ссылок на них в рабочем процессе. Сохранение значений в виде секретов GitHub является более безопасным вариантом.

В GitHub перейдите в репозиторий.
Выберите "Секреты безопасности>" и "Действия переменных>".
Нажмите Создать секрет репозитория.

Примечание.

Чтобы повысить безопасность рабочих процессов в общедоступных репозиториях, используйте секреты среды вместо секретов репозитория. Если среда требует утверждения, задание не сможет получить доступ к секретам среды, пока один из обязательных рецензентов не утвердит его.

Создайте секреты для AZURE_CLIENT_ID, AZURE_TENANT_ID и AZURE_SUBSCRIPTION_ID. Скопируйте эти значения из приложения Microsoft Entra или управляемого удостоверения, назначаемого пользователем, для секретов GitHub:

Секрет GitHub	Приложение Microsoft Entra или управляемое удостоверение, назначаемое пользователем
AZURE_CLIENT_ID	Client ID
AZURE_SUBSCRIPTION_ID	ИД подписки
AZURE_TENANT_ID	Идентификатор каталога (клиента)

Примечание.

По соображениям безопасности рекомендуется использовать секреты GitHub, а не передавать значения непосредственно в рабочий процесс.

В GitHub перейдите в репозиторий.
Перейдите к параметрам в меню навигации .
Выберите "Секреты безопасности>" и "Действия переменных>".
Нажмите Создать секрет репозитория.
Вставьте все выходные данные JSON, полученные из команды Azure CLI, в поле значения секрета. Присвойте секрету имя AZURE_CREDENTIALS.
Выберите Добавить секрет.

Добавление рабочего процесса

OpenID Connect
Субъект-служба

Перейдите в раздел Actions (Действия) для репозитория GitHub.
Выберите Set up your workflow yourself (Настроить рабочий процесс самостоятельно).
Удалите все содержимое в файле рабочего процесса после раздела on:. После этого рабочий процесс должен выглядеть примерно так.
```
name: CI with OpenID Connect

on:
    push:
        branches: [ main ]
```

Добавление раздела для разрешений.

name: CI with OpenID Connect

on:
    push:
        branches: [ main ]

permissions:
      id-token: write
      contents: read

Добавление действий для извлечения и входа. Эти действия извлекают код сайта из репозитория и выполняют проверку подлинности в Azure с помощью ранее созданных секретов GitHub.

name: CI with OpenID Connect

on:
    push:
        branches: [ main ]

permissions:
      id-token: write
      contents: read

jobs:
  build:
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v3
    - uses: azure/login@v2
      with:
      client-id: ${{ secrets.AZURE_CLIENT_ID }}
      tenant-id: ${{ secrets.AZURE_TENANT_ID }}
      subscription-id: ${{ secrets.AZURE_SUBSCRIPTION_ID }}

Используйте действие Azure CLI, чтобы передать код в хранилище BLOB-объектов и очистить конечную точку CDN. В az storage blob upload-batch замените заполнитель именем своей учетной записи хранения. Сценарий выполнит передачу в контейнер $web. В az cdn endpoint purge замените заполнители именем профиля CDN, именем конечной точки CDN и именем группы ресурсов. Чтобы ускорить очистку CDN, можно добавить параметр --no-wait в az cdn endpoint purge. Для повышения безопасности вы также можете добавить опцию --account-key с ключом учетной записи хранилища.
```
    - name: Upload to blob storage
      uses: azure/CLI@v1
      with:
        inlineScript: |
            az storage blob upload-batch --account-name <STORAGE_ACCOUNT_NAME>  --auth-mode key -d '$web' -s .
    - name: Purge CDN endpoint
      uses: azure/CLI@v1
      with:
        inlineScript: |
           az cdn endpoint purge --content-paths  "/*" --profile-name "CDN_PROFILE_NAME" --name "CDN_ENDPOINT" --resource-group "RESOURCE_GROUP"
```

Завершите создание рабочего процесса, добавив действие для выхода из Azure. Готовый рабочий процесс выглядит так. В папке .github/workflows репозитория появится новый файл.

name: CI with OpenID Connect

on:
    push:
        branches: [ main ]

permissions:
      id-token: write
      contents: read

jobs:
  build:
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v3
    - uses: azure/login@v2
      with:
      client-id: ${{ secrets.AZURE_CLIENT_ID }}
      tenant-id: ${{ secrets.AZURE_TENANT_ID }}
      subscription-id: ${{ secrets.AZURE_SUBSCRIPTION_ID }}

    - name: Upload to blob storage
      uses: azure/CLI@v1
      with:
        inlineScript: |
            az storage blob upload-batch --account-name <STORAGE_ACCOUNT_NAME> --auth-mode key -d '$web' -s .
    - name: Purge CDN endpoint
      uses: azure/CLI@v1
      with:
        inlineScript: |
           az cdn endpoint purge --content-paths  "/*" --profile-name "CDN_PROFILE_NAME" --name "CDN_ENDPOINT" --resource-group "RESOURCE_GROUP"

  # Azure logout
    - name: logout
      run: |
            az logout
      if: always()

Перейдите в раздел Actions (Действия) для репозитория GitHub.
Выберите Set up your workflow yourself (Настроить рабочий процесс самостоятельно).
Удалите все содержимое в файле рабочего процесса после раздела on:. После этого рабочий процесс должен выглядеть примерно так.
```
name: CI

on:
    push:
        branches: [ main ]
```
Присвойте рабочему процессу имя Blob storage website CI и добавьте действия для извлечения и входа. Эти действия извлекают код сайта из репозитория и выполняют проверку подлинности в Azure с помощью ранее созданного секрета GitHub AZURE_CREDENTIALS.
```
name: Blob storage website CI

on:
    push:
        branches: [ main ]

jobs:
  build:
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v3
    - uses: azure/login@v2
      with:
          creds: ${{ secrets.AZURE_CREDENTIALS }}
```
Используйте действие Azure CLI, чтобы передать код в хранилище BLOB-объектов и очистить конечную точку CDN. В az storage blob upload-batch замените заполнитель именем своей учетной записи хранения. Сценарий выполнит передачу в контейнер $web. В az cdn endpoint purge замените заполнители именем профиля CDN, именем конечной точки CDN и именем группы ресурсов. Чтобы ускорить очистку CDN, можно добавить параметр --no-wait в az cdn endpoint purge. Для повышения безопасности вы также можете добавить опцию --account-key с ключом учетной записи хранилища.
```
    - name: Upload to blob storage
      uses: azure/CLI@v1
      with:
        inlineScript: |
            az storage blob upload-batch --account-name <STORAGE_ACCOUNT_NAME>  --auth-mode key -d '$web' -s .
    - name: Purge CDN endpoint
      uses: azure/CLI@v1
      with:
        inlineScript: |
           az cdn endpoint purge --content-paths  "/*" --profile-name "CDN_PROFILE_NAME" --name "CDN_ENDPOINT" --resource-group "RESOURCE_GROUP"
```

name: Blob storage website CI

on:
    push:
        branches: [ main ]

jobs:
  build:
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v3
    - uses: azure/login@v2
      with:
          creds: ${{ secrets.AZURE_CREDENTIALS }}

    - name: Upload to blob storage
      uses: azure/CLI@v1
      with:
        inlineScript: |
            az storage blob upload-batch --account-name <STORAGE_ACCOUNT_NAME> --auth-mode key -d '$web' -s .
    - name: Purge CDN endpoint
      uses: azure/CLI@v1
      with:
        inlineScript: |
           az cdn endpoint purge --content-paths  "/*" --profile-name "CDN_PROFILE_NAME" --name "CDN_ENDPOINT" --resource-group "RESOURCE_GROUP"

  # Azure logout
    - name: logout
      run: |
            az logout
      if: always()

Проверка развертывания

Перейдите в раздел Actions (Действия) для репозитория GitHub.
Откройте первый результат, чтобы проверить подробные журналы выполнения рабочего процесса.

Очистка ресурсов

Когда статический веб-сайт и репозиторий GitHub перестанут быть нужны, очистите ненужные развернутые ресурсы, удалив группу ресурсов и репозиторий GitHub.

Следующие шаги

Узнайте больше о Статических веб-приложениях Azure.

Поделиться через

Использование рабочего процесса GitHub Actions для развертывания статического веб-сайта в службе хранилища Azure

Необходимые компоненты

Создание учетных данных для развертывания.

Настройка секретов GitHub

Добавление рабочего процесса

Проверка развертывания

Очистка ресурсов

Следующие шаги

Обратная связь

Дополнительные ресурсы