Gyakorlat – Konfigurációs beállítások implementálása az Azure App Configuration-példányban

Befejeződött

Az alkalmazás egy új követelménye szerint a funkciókapcsolóval lehet szabályozni egy termék kedvezményét. Ez a gyakorlat bemutatja, hogyan teheti ezt meg.

• Adjon hozzá egy konfigurációs beállítást az Azure App Configuration-példányhoz.
• Adjon hozzá kódot az új beállítás használatához a termékárak kedvezményéhez.
• Az alkalmazás létrehozása és tesztelése.

A konfigurációs beállítás hozzáadása az Alkalmazáskonfigurációs áruházhoz

Az Azure App Configurationban most hozzon létre egy új kulcs-érték párot az értékesítési kedvezmény százalékos arányának tárolásához. Hajtsa végre a következő lépéseket:

1. Egy másik böngészőlapon jelentkezzen be a Azure Portal ugyanazzal a fiókkal és címtárral, mint az Azure CLI.
2. A keresőmező használatával keresse meg és nyissa meg az alkalmazáskonfigurációs erőforrást eshop-app-featureselőtaggal.
3. Az Operations (Műveletek ) szakaszban válassza a Configuration Explorer (Konfigurációkezelő) lehetőséget.
4. A felső menüben válassza ki a + Létrehozás és válassza ki a Kulcs-érték lehetőséget.
5. A kulcs mezőbe írja be a eShopLite__Store__DiscountPercent.
6. Az Érték mezőbe írja be 0,8.
7. Válassza a Alkalmazlehetőséget.

Kód hozzáadása az új konfigurációs beállítás használatához

A termékoldalt frissíteni kell az új konfigurációs beállítás használatához. Hajtsa végre a következő lépéseket:

1. Nyissa meg a Store/Components/Pages/Products.razor fájlt a Visual Studio Code-ban.

2. A @code szakaszban adja hozzá a következő változót a funkciójelző állapotának tárolásához:

   private decimal discountPercentage;  
   

3. A OnInitializedAsync metódusban adja hozzá a következő kódot a konfigurációs beállítás értékének lekéréséhez:

   if (saleOn) {
     discountPercentage = Convert.ToDecimal(Configuration.GetSection("eShopLite__Store__DiscountPercent").Value);
   }
   

   A metódusnak most a következő kódhoz hasonlóan kell kinéznie:

   protected override async Task OnInitializedAsync()
   {
       saleOn = await FeatureManager.IsEnabledAsync("SeasonalDiscount");
   
       // Simulate asynchronous loading to demonstrate streaming rendering
       products = await ProductService.GetProducts();
   
       if (saleOn) {
         discountPercentage = Convert.ToDecimal(Configuration.GetSection("eShopLite__Store__DiscountPercent").Value);
       }
   }
   

   A fenti kód a Konfiguráció objektummal kéri le a konfigurációs beállítás értékét. Az érték a discountPercentage változóban tizedesjelként van tárolva.

A kedvezményes árak megjelenítése

A termékoldalt frissíteni kell a kedvezményes árak megjelenítéséhez. Hajtsa végre a következő lépéseket:

1. Cserélje le a <td>@product.Price</td> a következő kódra:

   <td>
     @if (saleOn) {
       <strike>@(product.Price)</strike><br>
       @((product.Price * discountPercentage).ToString("#.##"))
     } else {
       @product.Price
     }
   </td>
   

   A fenti kód ellenőrzi, hogy engedélyezve van-e a szezonális értékesítés. Ha engedélyezve van, az eredeti ár áthúzással jelenik meg, alatta pedig a kedvezményes ár jelenik meg. Ha a szezonális értékesítés nincs engedélyezve, az eredeti ár jelenik meg.

Az alkalmazás létrehozása

1. Győződjön meg arról, hogy mentette az összes módosítást, és a dotnet-feature-flags könyvtárban van. Futtassa a következő parancsot a terminálban:

   dotnet publish /p:PublishProfile=DefaultContainer 
   

2. Futtassa az alkalmazást a Docker használatával:

   docker compose up
   

Az árkedvezmény funkció tesztelése

Ha ellenőrizni szeretné, hogy a funkciójelző a várt módon működik-e egy kódtérben, hajtsa végre az alábbi lépéseket:

1. Váltson a PORTok lapra, majd az előtérport helyi címétől jobbra válassza a földgömb ikont. A böngésző új lapot nyit meg a kezdőlapon.
2. Válassza a Termékeket.

Ha helyileg használja a Visual Studio Code-ot, nyissa meg http://localhost:32000/products.

A szezonális értékesítést vezérlő funkciójelző teszteléséhez hajtsa végre a következő lépéseket:

1. Az Azure Portalon lépjen a eshop-app-featureselőtaggal ellátott Azure App Configuration-erőforrásra.

2. Az Operations (Műveletek ) szakaszban válassza a Funkciókezelőt.

3. A funkció kikapcsolásához válassza a SeasonalDiscount kapcsolót.

   

4. A böngészőben térjen vissza az alkalmazáshoz.

5. Válassza ki a kezdőlapot , majd a Termékek lapot.

   

A gyorsítótár törlése akár 30 másodpercet is igénybe vehet. Ha az értékesítési szalagcím továbbra is megjelenik, várjon néhány másodpercet, és frissítse újra az oldalt.