Publicera API:et med GitHub Actions

Du har lagt till ditt API i webbappen och båda körs lokalt. Nu är det dags att publicera ditt API och din app till Azure Static Web Apps.

När du skapade Azure Static Web Apps-instansen och bad den att titta på din huvudgren genererades en GitHub-åtgärd åt dig. GitHub-åtgärden lyssnar efter ändringar i arkivets huvudgren, och när den identifierar en incheckning eller en pull-begäran till huvudgren, bygger och publicerar den din app.

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 apiför . Men eftersom du inte hade något API i mappen vid den tidpunkten api försökte Azure Static Web Apps inte publicera ett API.

Nu ändras allt.

GitHub Action-konfiguration

Mappen .github/workflows innehåller din GitHub Action-fil. Filen innehåller inställningarna för platserna för webbappen, API:et och byggartefakterna. 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

Ditt api_location värde är inställt på rätt värde för att peka på DITT API i mappen api .

Utlösa GitHub-åtgärden

GitHub-åtgärden är redo att skapa och publicera webbappen och API:et när en ändring upptäcks i huvudgrenen. Om du vill utlösa GitHub-åtgärden kan du antingen committa 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.

Url:er för förhandsversion

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 den gren som din GitHub-åtgärd tittar på. Din livewebbplats påverkas inte. I stället skapas en ny testversion av appen. 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 request till samma gren publicerar till en annan URL.

Du arbetar just nu i api-grenen. Gör en pull-begäran från api-grenen till huvudgrenen . När du skapar pull-begäran mot huvudgrenen publicerar GitHub-åtgärden appen till en förhandsgransknings-URL.

När arbetsflödet har slutfört byggandet och driftsättningen av din app, lägger GitHub-botten till en kommentar till din pull-begäran som innehåller URL:en till förproduktionsmiljön. Du kan välja den här länken för att se dina förberedda ändringar.

Därefter skapar du en pull-förfrågan och besöker den förberedda versionen av din app.