Skip to main content

Déploiement d'une application web statique sur Azure

Découvrez comment déployer une application web sur Azure Application web statique dans le cadre de vos flux de travail de déploiement continu (CD).

Dans cet article

Prérequis

Pour pouvoir créer votre flux de travail GitHub Actions, vous devez d’abord suivre la procédure de configuration ci-dessous :

  1. Créez une application web statique Azure à l'aide de l'option « Autre » pour la source de déploiement. Pour plus d’informations, consultez Démarrage rapide : Créer votre premier site statique dans le portail Azure dans la documentation Azure.

  2. Créez un secret nommé AZURE_STATIC_WEB_APPS_API_TOKEN avec la valeur de votre jeton de déploiement pour Static Web Apps. Pour plus d’informations sur la recherche de votre jeton de déploiement, consultez Reset deployment tokens in Azure Static Web Apps dans la documentation Azure.

Création du flux de travail

Une fois que vous avez rempli les prérequis, vous pouvez passer à la création du flux de travail.

L’exemple de flux de travail suivant montre comment générer et déployer une application web statique Azure lorsqu’il existe un push vers la branche main ou lorsqu’une demande de tirage ciblant main est ouverte, synchronisée ou rouverte. Le flux de travail supprime également le déploiement de préproduction correspondant lorsqu'une pull request visant main est fermée.

Sous la clé env de workflow, remplacez les valeurs suivantes : * APP_LOCATION par l’emplacement de votre code client ; * API_LOCATION vers l'emplacement de votre code source de l'API (si API_LOCATION n’est pas pertinent, vous pouvez supprimer la variable et les lignes où elle est utilisée) ; * OUTPUT_LOCATION vers l’emplacement de la sortie de build de votre code client.

Pour plus d’informations sur ces valeurs, consultez la configuration Build pour Azure Static Web Apps dans la documentation Azure.

YAML
# Ce workflow utilise des actions qui ne sont pas certifiées par GitHub.
# Elles sont fournies par un tiers et régies par
# des conditions d’utilisation du service, une politique de confidentialité et un support distincts.
# documentation en ligne.

# GitHub recommande d’épingler les actions à un SHA de commit.
# Pour obtenir une version plus récente, vous devez mettre à jour le SHA.
# Vous pouvez également référencer une balise ou une branche, mais l’action peut changer sans avertissement.

name: Deploy web app to Azure Static Web Apps

env:
  APP_LOCATION: "/" # location of your client code
  API_LOCATION: "api" # location of your api source code - optional
  OUTPUT_LOCATION: "build" # location of client code build output

on:
  push:
    branches:
      - main
  pull_request:
    types: [opened, synchronize, reopened, closed]
    branches:
      - main

permissions:
  issues: write
  contents: read
  pull-requests: write

jobs:
  build_and_deploy:
    if: github.event_name == 'push' || (github.event_name == 'pull_request' && github.event.action != 'closed')
    runs-on: ubuntu-latest
    name: Build and Deploy
    steps:
      - uses: actions/checkout@v5
        with:
          submodules: true
      - name: Build And Deploy
        uses: Azure/static-web-apps-deploy@1a947af9992250f3bc2e68ad0754c0b0c11566c9
        with:
          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN }}
          repo_token: ${{ secrets.GITHUB_TOKEN }}
          action: "upload"
          app_location: ${{ env.APP_LOCATION }}
          api_location: ${{ env.API_LOCATION }}
          output_location: ${{ env.OUTPUT_LOCATION }}

  close_pull_request:
    if: github.event_name == 'pull_request' && github.event.action == 'closed'
    runs-on: ubuntu-latest
    name: Close Pull Request
    steps:
      - name: Close Pull Request
        uses: Azure/static-web-apps-deploy@1a947af9992250f3bc2e68ad0754c0b0c11566c9
        with:
          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN }}
          action: "close"

Pour aller plus loin

  • Pour le modèle de workflow d’origine, consultez azure-staticwebapp.yml dans le référentiel GitHub Actions starter-workflows.
  • L’action utilisée pour déployer l’application web est l’action officielle Azure Azure/static-web-apps-deploy.
  • Pour plus d’exemples de flux de travail d’action GitHub qui se déploient sur Azure, consultez le référentiel actions-workflow-samples.