Publier l’API avec GitHub Actions
Vous avez ajouté votre API à votre application web, et les deux s’exécutent localement. À présent, il est temps de publier votre API et votre application dans Azure Static Web Apps.
Quand vous avez créé l’instance Azure Static Web Apps et que vous lui avez demandé de surveiller votre branche main, une action GitHub a été générée pour vous. GitHub Action écoute les modifications apportées à la branche principale de votre référentiel, et quand elle détecte une validation ou une demande de tirage principale, elle génère et publie votre application.
Vous vous souvenez peut-être du moment où vous avez créé la ressource Azure Static Web Apps à laquelle vous avez fourni l’emplacement de dossier pour votre API. Vous avez fourni la valeur par défaut api. Toutefois, comme vous n’aviez pas d’API dans le dossier api à ce moment-là, Azure Static Web Apps n’a pas tenté de publier une API.
À présent, la situation est différente.
Configuration de l’action GitHub
Le dossier .github/workflows contient votre fichier d’action GitHub. Ce fichier contient les paramètres relatifs aux emplacements de votre application web, de l’API et des artefacts de build. Les emplacements que vous avez choisis en créant votre ressource Azure Static Web Apps se trouvent maintenant dans ce fichier, comme indiqué ici :
app_location: 'angular-app' # App source code path
api_location: 'api' # Api source code path - optional
output_location: 'dist/angular-app' # Built app content directory - optional
app_location: 'react-app' # App source code path
api_location: 'api' # Api source code path - optional
output_location: 'build' # Built app content directory - optional
app_location: 'svelte-app' # App source code path
api_location: 'api' # Api source code path - optional
output_location: 'public' # Built app content directory - optional
app_location: 'vue-app' # App source code path
api_location: 'api' # Api source code path - optional
output_location: 'dist' # Built app content directory - optional
Votre paramètre api_location est défini sur la valeur correcte pour pointer vers votre API dans votre dossier api.
Déclencher l’action GitHub
L’action GitHub est prête à générer et à publier votre application web et votre API une fois qu’elle détecte une modification de votre branche main. Pour déclencher l’action GitHub, vous pouvez commiter directement ou créer une demande de tirage sur la branche main. Les modifications qui sont détectées sur la branche main déclenchent l’action GitHub pour publier l’application à la même URL pour votre site web en ligne.
URL d’aperçu
Parfois, vous souhaitez voir vos modifications dans un site de préproduction avant de les publier sur le site web en ligne. Azure Static Web Apps vous permet d’afficher un aperçu de vos modifications par le biais des URL d’aperçu. Vous pouvez créer une URL d’aperçu en créant une demande de tirage sur la branche surveillée par votre action GitHub. Votre site web en ligne n’est pas affecté. Au lieu de cela, une nouvelle version intermédiaire de votre application est créée. Si vous revenez en arrière et vérifiez votre demande de tirage sur GitHub, vous devriez voir un lien vers la version intermédiaire a été publié dans l’onglet Conversation.
Le tableau suivant montre comment Azure Static Web Apps publie votre application vers différentes URL. Votre application publie vers une URL, alors qu’une demande de tirage sur la même branche publie vers une autre URL.
| Source | Description | URL |
|---|---|---|
| Branche main | URL du site web en ligne | https://purple-rain-062d03304.azurestaticapps.net/ |
| Demande de tirage (pull request) n° 5 | URL d’aperçu | https://purple-rain-062d03304-5.azurestaticapps.net/ |
Vous travaillez actuellement dans la branche api. Effectuez une demande de tirage à partir de votre branche api à la branche main. Quand vous créez la demande de tirage sur la branche main, l’action GitHub publie l’application vers une URL d’aperçu.
Une fois que le workflow a terminé la génération et le déploiement de votre application, le bot GitHub ajoute un commentaire à votre demande de tirage qui contient l’URL de l’environnement de préproduction. Vous pouvez sélectionner ce lien pour afficher les changements indexés.
Ensuite, vous créez une demande de tirage et visiter la version intermédiaire de votre application.