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 instansen av Azure Static Web Apps och bad den övervaka din huvudgren skapades en GitHub Action åt dig. GitHub-åtgärden lyssnar efter ändringar i lagringsplatsens huvudgrenen, och när den identifierar en incheckning eller en pull-begäran för att huvudsakligaskapar 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 för api. Men eftersom du inte hade något API i -API:et mapp vid den tidpunkten 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
Din api_location är inställd på rätt värde för att peka på ditt API i din api- mapp.
Utlösa GitHub-åtgärden
GitHub-åtgärden är redo att bygga och publicera din webbapp och ditt API när den upptäcker en ändring av din main branch. Om du vill utlösa GitHub-åtgärden kan du antingen göra en commit direkt eller skapa en pull-förfrågan till main-grenen. Ä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.
| Källa | Beskrivning | URL |
|---|---|---|
| huvudgren | Url för livewebbplats | https://purple-rain-062d03304.azurestaticapps.net/ |
| Pull-begäran nr 5 | Förhandsgransknings-URL | https://purple-rain-062d03304-5.azurestaticapps.net/ |
Du arbetar för närvarande i grenen api. Gör en pull-begäran från din api-gren till huvudgrenen . När du skapar en pull request mot huvudgrenen publicerar GitHub-åtgärden appen på 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.