Pubblicare l'API con GitHub Actions
L'API è stata aggiunta all'app Web ed entrambe sono in esecuzione in locale. A questo punto, è possibile pubblicare l'API e l'app in App Web statiche di Azure.
Quando è stata creata l'istanza di App Web statiche di Azure ed è stato richiesto di controllare il ramo main, è stato generato un flusso di lavoro di GitHub Actions. GitHub Actions è in ascolto delle modifiche apportate al ramomain del repository e quando rileva un commit o una richiesta pull per main, compila e pubblica l'app.
Si ricorderà che quando è stata creata la risorsa di App Web statiche di Azure, è stato specificato il percorso della cartella per l'API. È stato specificato il valore predefinito api. Tuttavia, poiché in quel momento la cartella api non conteneva un'API, App Web statiche di Azure non ha tentato di pubblicare un'API.
A questo punto, cambia tutto.
Configurazione di GitHub Actions
La cartella .github/workflows contiene il file di GitHub Actions. Il file contiene le impostazioni per i percorsi per l'app Web, l'API e gli artefatti di compilazione. I percorsi scelti durante la creazione della risorsa di App Web statiche di Azure si trovano ora in questo file, come mostrato qui:
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
api_location è impostato sul valore corretto in modo da puntare all'API nella cartella api.
Attivare GitHub Actions
GitHub Actions è pronto a compilare e pubblicare l'app Web e l'API quando rileva una modifica nel ramo main. Per attivare GitHub Actions, è possibile eseguire il commit diretto o creare una richiesta pull al ramo main. Le modifiche rilevate nel ramo main attivano GitHub Actions per la pubblicazione dell'app nello stesso URL del sito Web attivo.
URL di anteprima
In alcuni casi è necessario visualizzare le modifiche in un sito di staging prima della pubblicazione nel sito Web live. App Web statiche di Azure consente di visualizzare in anteprima le modifiche tramite URL di anteprima. È possibile creare un URL di anteprima creando una richiesta pull sul ramo monitorato da GitHub Actions. Il sito Web live non è interessato. Viene invece creata una nuova versione di staging dell'app. Se si torna indietro e si controlla la richiesta pull in GitHub, dovrebbe essere visualizzato un collegamento alla versione di staging inserito nella scheda Conversation.
La tabella seguente mostra in che modo App Web statiche di Azure pubblicha l'app in URL diversi. L'app viene pubblicata in un URL, mentre una richiesta pull allo stesso ramo viene pubblicata in un altro URL.
| Origine | Descrizione | URL |
|---|---|---|
| Ramo main | URL del sito Web attivo | https://purple-rain-062d03304.azurestaticapps.net/ |
| Richiesta pull n. 5 | URL di anteprima | https://purple-rain-062d03304-5.azurestaticapps.net/ |
Attualmente ci si trova nel ramo api. Effettuare una richiesta pull dal ramo api al ramo main. Quando si crea la richiesta pull sul ramo main, GitHub Actions pubblica l'app in un URL di anteprima.
Quando il flusso di lavoro ha completato la compilazione e la distribuzione dell'app, il bot GitHub aggiunge un commento alla richiesta pull, che contiene l'URL dell'ambiente di pre-produzione. È possibile selezionare questo collegamento per visualizzare le modifiche preparate per il commit.
Creare quindi una richiesta pull e visitare la versione preparata per il commit dell'app.