Gyakorlat – Tartalék útvonalak létrehozása

Befejeződött

Eljött az ideje, hogy létrehozzon egy tartalék útvonalat, hogy a felhasználók sikeresen el tudjanak navigálni az alkalmazáshoz.

A legújabb kód lekérése

Az Azure Static Web Apps hozzáadta a GitHub Actions-munkafolyamat fájlját az előző gyakorlatban kiválasztott ághoz. Először lekérheti ezt a fájlt úgy, hogy lekéri a kódot a Gitből.

A következő lépésekkel kérheti le a kód módosításait a Gitből:

  1. Nyissa meg a ShoppingList megoldást a Visual Studióban.

  2. Kérje le a legfrissebb módosításokat a GitHubról.

    Screenshot showing where to pull changes from GitHub.

A munkafolyamat-fájl most már a .github/workflows mappában látható a Windows Intézőben (a fájl nem része a Visual Studio-megoldásnak).

Útválasztási szabály létrehozása

Az alkalmazás közzététele előtt hozzon létre olyan útválasztási szabályokat, amelyek tartalék útvonalat tartalmaznak.

A staticwebapp.config.json fájl létrehozása

Ha még nem rendelkezik staticwebapp.config.json fájllal a projektben, az alábbi lépések végrehajtásával hozhat létre egyet:

  1. A Visual Studióban kattintson a jobb gombbal a wwwroot mappára a Client projekten belül.

  2. Válassza a Hozzáadás –> Új elem lehetőséget.

  3. Válassza ki a JSON-fájlt az elérhető sablonok közül, nevezze el staticwebapp.config.json néven, és nyomja le az Enter billentyűt.

A staticwebapp.config.json létrehozása után frissítse a következő tartalék útvonalat:

{
  "navigationFallback": {
    "rewrite": "index.html",
    "exclude": ["/_framework/*", "/css/*"]
  }
}

A módosítások leküldése a Gitbe

Most mentse és véglegesítse a módosításokat a helyi Git-adattárban. Ezután küldje le ezeket a módosításokat a GitHubra.

A tartalék útvonal kipróbálása

A GitHub Actions munkafolyamat létrehozza és üzembe helyezi az alkalmazást.

Nyissa meg az adattárat a böngészőben, és tekintse meg a GitHub Actions-művelet előrehaladását. Az előrehaladás megtekintéséhez kövesse az alábbi lépéseket:

  1. Válassza a Műveletek menüt.

  2. A Munkafolyamatok menüben válassza ki az Azure Static Web Apps CI/CD munkafolyamat-elemét.

  3. Válassza ki a művelet legújabb (felső) hivatkozását a jobb oldalon.

  4. Válassza a Build and Deploy Job (Feladat összeállítása és üzembe helyezése) hivatkozást.

Követheti a GitHub Actions-művelet előrehaladását a webalkalmazás és az API-k létrehozása és közzététele során.

Az alkalmazás ismételt üzembe helyezése után keresse meg. Figyelje meg, hogy az URL-címben megjelenik a /products kifejezés. Most frissítse a böngészőt az F5 billentyű lenyomásával a tartalék útvonal teszteléséhez. Az alkalmazásnak az útválasztási szabályok között megadott tartalék útvonalnak köszönhetően sikeresen újra be kell töltődnie!