Az API közzététele a GitHub Actions használatával
Hozzáadta az API-t a webalkalmazáshoz, és mindkettő helyileg fut. Itt az ideje, hogy közzétegye az API-t és az alkalmazást az Azure Static Web Appsben.
Amikor létrehozta az Azure Static Web Apps-példányt, és megadta, hogy figyelje a saját fő ágadat, generálódott egy GitHub-művelet. A GitHub-művelet figyeli az adattár fő ágának módosításait, és amikor véglegesítési vagy lekéréses kérelmet észlel a főághoz, létrehozza és közzéteszi az alkalmazást.
Bizonyára emlékszik, amikor létrehozta az Azure Static Web Apps-erőforrást, és megadta az API mappa helyét. Ön adta meg a következő alapértelmezett értékét api: . Mivel azonban akkoriban nem volt API a api mappában, az Azure Static Web Apps nem próbált API-t közzétenni.
Most minden megváltozik.
A GitHub Action konfigurálása
A .github/workflows mappa tartalmazza a GitHub Action-fájlt. A fájl tartalmazza a webalkalmazás, az API és a buildösszetevők helyének beállításait. Az Azure Static Web Apps-erőforrás létrehozásakor kiválasztott helyek mostantól ebben a fájlban találhatók, az itt látható módon:
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
A api_location megfelelő értékre van állítva, hogy az API-ja a api mappában mutasson.
A GitHub-művelet aktiválása
A GitHub-művelet készen áll, hogy webalkalmazását és API-ját elkészítse és közzétegye, amint észleli a főág változását. A GitHub-művelet aktiválásához közvetlenül véglegesíthet, vagy létrehozhat egy pull-kérelmet a fő ághoz. A fő ágon észlelt módosítások aktiválják a GitHub-műveletet, hogy az alkalmazást ugyanazon az URL-címen tegye közzé az élő webhelyén.
Előzetes verziójú URL-címek
Előfordulhat, hogy az élő webhelyen való közzététel előtt látni szeretné a módosításokat egy átmeneti webhelyen. Az Azure Static Web Apps előnézeti URL-ek segítségével tekintheti meg a módosítások előnézetét. Előnézeti URL-címet úgy hozhat létre, hogy lekéréses kérelmet hoz létre azon ágon, amelyet a GitHub-művelet figyel. Az élő webhelye nincs érintve. Ehelyett létrejön az alkalmazás új átmeneti verziója. Ha visszalép, és ellenőrzi a lekéréses kérelmet a GitHubon, a Beszélgetés lapon közzétett átmeneti verzióra mutató hivatkozást kell látnia.
Az alábbi táblázat azt mutatja be, hogy az Azure Static Web Apps hogyan teszi közzé az alkalmazást különböző URL-címeken. Az alkalmazás egy URL-re publikál, míg egy pull-kérelem ugyanazon ágon egy másik URL-re publikál.
| Forrás | Leírás | URL |
|---|---|---|
| fő ág | Élő webhely URL-címe | https://purple-rain-062d03304.azurestaticapps.net/ |
| Lekéréses kérelem #5 | Előnézet URL | https://purple-rain-062d03304-5.azurestaticapps.net/ |
Jelenleg az API ágában dolgozik. Lekéréses kérést kezdeményezhet az API-ágról a fő ágra. Amikor létrehozza a lekéréses kérelmet a fő ágon, a GitHub-művelet közzéteszi az alkalmazást egy előzetes verziójú URL-címen.
Miután a munkafolyamat befejezte az alkalmazás összeállítását és üzembe helyezését, a GitHub-robot megjegyzést fűz a lekéréses kérelemhez, amely tartalmazza az előkészületi környezet URL-címét. Erre a hivatkozásra kattintva megtekintheti a szakaszos módosításokat.
Ezután létrehoz egy pull-kérelmet, és felkeresi az alkalmazás előzetes verzióját.