Publicera API:et med GitHub Actions
Du har lagt till ett API för din webbapp och båda körs lokalt. Nu är det dags att publicera webbappen och API:et på Azure Static Web Apps.
När du skapade Azure Static Web Apps-instansen och beordrade den att övervaka main-grenen, genererades en GitHub-åtgärd åt dig. GitHub-åtgärden lyssnar efter ändringar i lagringsplatsens huvudgren , och när den identifierar en incheckning eller en pull-begäran till main skapas och publiceras appen.
Du kanske kommer ihåg när du skapade den Azure Static Web Apps-resurs som du angav mappplatsen för ditt API. Du angav standardvärdet api. Men eftersom du inte hade något API i mappen api vid den tidpunkten försökte Azure Static Web Apps inte publicera något API.
Nu förändras allt.
Konfiguration av GitHub-åtgärd
GitHub-åtgärdsfilen finns i mappen .github/workflows. Filen innehåller inställningarna för platserna för din webbapp, ditt API och dina artefakter. De platser som du valde när du skapade din Azure Static Web Apps-resurs finns nu i den här filen, som du ser här:
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
Värdet för api_location pekar korrekt till API:et i din api-mapp.
Utlösa GitHub-åtgärden
GitHub-åtgärden är redo att bygga och publicera webbappen och API:et när en ändring i main-grenen upptäcks. Om du vill utlösa GitHub-åtgärden kan du antingen checka in direkt eller skapa en pull-begäran till huvudgrenen. Ändringar som identifieras på huvudgrenen utlöser GitHub-åtgärden för att publicera appen på samma URL för din livewebbplats.
Förhandsgransknings-URL:er
Ibland vill du se dina ändringar på en mellanlagringsplats innan du publicerar till livewebbplatsen. Med Azure Static Web Apps kan du se en förhandsversion av dina ändringar via förhandsgransknings-URL:er. Du kan skapa en förhandsgransknings-URL genom att skapa en pull-begäran mot grenen som GitHub-åtgärden övervakar. Din livewebbplats påverkas inte. I stället skapas en ny mellanlagringsversion av din app. Om du går tillbaka och kontrollerar din pull-begäran på GitHub bör du se en länk till mellanlagringsversionen som publicerats på fliken Konversation.
I följande tabell visas hur Azure Static Web Apps publicerar din app till olika URL:er. Appen publicerar till en URL medan en pull-begäran till samma gren publicerar till en annan URL.
| Source | beskrivning | Webbadress |
|---|---|---|
| main-grenen | URL till aktiv webbplats | https://purple-rain-062d03304.azurestaticapps.net/ |
| Pull-begäran nr 5 | Förhandsgranskning-URL | https://purple-rain-062d03304-5.azurestaticapps.net/ |
Du arbetar för närvarande i api-grenen. Gör en pull-begäran från api-grenen till huvudgrenen. När du skapar pull-begäran mot main-grenen publicerar GitHub-åtgärden appen till en förhandsgransknings-URL.
När arbetsflödet har skapats och distribuerats lägger GitHub-roboten till en kommentar till din pull-begäran som innehåller URL:en för förproduktionsmiljön. Du kan välja den här länken för att se dina mellanlagrade ändringar.
Därefter skapar du en pull-begäran och besöker den mellanlagrade versionen av din app.