Azure Relay kullanarak şirket içi WCF hizmetini buluttaki bir web uygulamasına sunma

Bu makale, Microsoft Azure ve Visual Studio ile nasıl karma bulut uygulaması derleyeceğinizi gösterir. Bulutta birden çok Azure kaynağı kullanan bir uygulama oluşturursunuz. Bu öğretici şunları öğrenmenize yardımcı olur:

  • Bir web çözümünde kullanılması amacıyla web hizmeti oluşturma veya var olan bir web hizmetini uyarlama.
  • Azure uygulamasıyla başka bir yerde barındırılan web hizmeti arasında veri paylaşmak için Azure Windows Communication Foundation (WCF) Geçiş hizmetini kullanma.

Bu öğreticide aşağıdaki görevleri gerçekleştirin:

  • Bu öğretici için önkoşulları yükleyin.
  • Senaryoyu gözden geçirin.
  • Ad alanı oluşturun.
  • Şirket içi sunucu oluşturma.
  • ASP .NET uygulaması oluşturma.
  • Uygulamayı yerel olarak çalıştırın.
  • Web uygulamasını Azure'a dağıtın.
  • Uygulamayı Azure'da çalıştırın.

Ön koşullar

Bu öğreticiyi tamamlamak için aşağıdaki önkoşulları karşılamanız gerekir:

Azure Relay geçişinin karma çözümlere yönelik yardımları

İş çözümleri genellikle özel kod ve mevcut işlevlerin birleşiminden oluşur. Özel kod, yeni ve benzersiz iş gereksinimlerini karşılar. Zaten mevcut olan çözümler ve sistemler mevcut işlevleri sağlar.

Çözüm mimarları, ölçek gereksinimlerini daha kolay bir şekilde karşılamak ve işlem maliyetlerini düşürmek için bulutu kullanmaya başlıyor. Bunu yaparken, çözümleri için yapı taşları olarak kullanmak istedikleri mevcut hizmet varlıklarının kurumsal güvenlik duvarının içinde olduğunu ve bulut çözümünün kolayca erişemediğini fark ederler. Birçok iç hizmet, şirket ağ uçlarında kolayca kullanıma sunulacak şekilde derlenmemiş veya barındırılmamalıdır.

Azure Relay mevcut WCF web hizmetlerini alır ve bu hizmetleri kurumsal ağ altyapısında müdahaleci değişikliklere gerek kalmadan şirket çevresi dışındaki çözümler için güvenli bir şekilde erişilebilir hale getirir. Bu tür geçişi hizmetleri, var olan ortamlarında barındırılmaya devam eder ancak bu hizmetler gelen oturumları ve istekleri bulutta barındırılan geçiş hizmetine devreder. Ayrıca, Azure Geçişi Paylaşılan Erişim İmzası (SAS) kimlik doğrulaması kullanarak bu hizmetleri yetkilendirilmemiş erişime karşı korur.

Senaryoyu gözden geçirin

Bu öğreticide, ürün envanteri sayfasında ürünlerin listesini görmenizi sağlayan bir ASP.NET web sitesi oluşturacaksınız.

Scenario

Öğretici, var olan şirket içi sistemde ürün bilgilerine sahip olduğunuzu varsayar ve bu sisteme erişmek için Azure Geçişini kullanır. Basit bir konsol uygulamasında çalışan bir web hizmeti bu durumun simülasyonunu oluşturur. Bellek içi bir ürün kümesi içerir. Bu konsol uygulamasını kendi bilgisayarınızda çalıştırabilir ve web rolünü Azure'a dağıtabilirsiniz. Bunu yaptığınızda, Azure veri merkezinde çalışan web rolünün bilgisayarınıza nasıl çağrı yaptığını göreceksiniz. Bilgisayarınız en az bir güvenlik duvarının ve ağ adresi çevirisi (NAT) katmanının arkasında olsa bile bu çağrı gerçekleşir.

Geliştirme ortamını ayarlama

Azure uygulamalarını geliştirmeye başlamadan önce, araçları indirip geliştirme ortamınızı ayarlayın:

  1. SDK indirme sayfasından .NET için Azure SDK'sını yükleyin.
  2. .NET sütununda, kullandığınız Visual Studio sürümünü seçin. Bu öğreticide Visual Studio 2019 kullanılır.
  3. Yükleyiciyi çalıştırmanız veya kaydetmesi istendiğinde Çalıştır'ı seçin.
  4. Web Platformu Yükleyicisi iletişim kutusunda Yükle'yi seçin ve yüklemeye devam edin.

Yükleme tamamlandıktan sonra uygulamayı geliştirmeye başlamak için gereken her şeye sahip olacaksınız. SDK, Visual Studio'da Azure uygulamalarını kolayca geliştirmenize olanak sağlayan araçları içerir.

Ad alanı oluşturma

İlk adım bir ad alanı oluşturmak ve Paylaşılan Erişim İmzası (SAS) anahtarı almaktır. Ad alanı, geçiş hizmeti aracılığıyla kullanıma sunulan her uygulama için bir uygulama sınırı sağlar. Hizmet ad alanı oluşturulduğunda sistem tarafından otomatik olarak bir SAS anahtarı oluşturulur. Hizmet ad alanı ve SAS anahtarı birleşimi, Azure'ın bir uygulamaya erişimin kimliğini doğrulamak için kimlik bilgilerini sağlar.

  1. Azure Portal oturum açın.

  2. Soldaki menüden Tüm hizmetler'i seçin. Tümleştirme'yi seçin, Geçişler'i arayın, fareyi Geçişler'in üzerine getirin ve oluştur'u seçin.

    Screenshot showing the selection of Relays -> Create button.

  3. Ad alanı oluştur sayfasında şu adımları izleyin:

    1. Ad alanının oluşturulacağı bir Azure aboneliği seçin.

    2. Kaynak grubu için, ad alanının yerleştirileceği mevcut bir kaynak grubunu seçin veya yeni bir tane oluşturun.

    3. Geçiş ad alanı için bir ad girin.

    4. Ad alanınızın barındırılacağı bölgeyi seçin.

    5. Sayfanın alt kısmındaki Gözden geçir ve oluştur'u seçin.

      Screenshot showing the Create namespace page.

    6. Gözden Geçir + oluştur sayfasında Oluştur'u seçin.

    7. Birkaç dakika sonra ad alanının Geçiş sayfasını görürsünüz.

      Screenshot showing the home page for Relay namespace.

Yönetim kimlik bilgilerini alma

  1. Geçiş sayfasında, soldaki menüden Paylaşılan erişim ilkeleri'ni seçin. `

  2. Paylaşılan erişim ilkeleri sayfasında RootManageSharedAccessKey'i seçin.

  3. SAS İlkesi: RootManageSharedAccessKey altında Birincil Bağlan ion Dizesi'nin yanındaki Kopyala düğmesini seçin. Bu eylem, bağlantı dizesi daha sonra kullanmak üzere panonuza kopyalar. Bu değeri Not Defteri veya başka bir geçici konuma yapıştırın.

  4. Birincil anahtar değerini daha sonra kullanmak üzere kopyalayıp geçici bir konuma yapıştırarak önceki adımı tekrarlayın.

    Screenshot showing the connection info for Relay namespace.

Şirket içi sunucu oluşturma

İlk olarak, sanal bir şirket içi ürün kataloğu sistemi oluşturursunuz. Bu proje bir Visual Studio konsol uygulamasıdır ve Service Bus kitaplıkları ile yapılandırma ayarlarını dahil etmek için Azure Service Bus NuGet paketini kullanır.

  1. Microsoft Visual Studio'yu yönetici olarak başlatın. Bunu yapmak için Visual Studio program simgesine sağ tıklayın ve Yönetici olarak çalıştır'ı seçin.

  2. Visual Studio'da Yeni proje oluştur'u seçin.

  3. Yeni proje oluştur bölümünde C# için Konsol Uygulaması (.NET Framework) öğesini ve ardından İleri'yi seçin.

  4. Projeye ProductsServer adını verin ve Oluştur'u seçin.

    Configure your new project

  5. Çözüm Gezgini ProductsServer projesine sağ tıklayın ve ardından NuGet Paketlerini Yönet'i seçin.

  6. Gözat'ı seçin, ardından WindowsAzure.ServiceBus için arama yapın ve seçin. Yükle'yi seçin ve kullanım koşullarını kabul edin.

    Select NuGet package

    Gerekli istemci derlemelerine artık başvurulmektedir.

  7. Ürün sözleşmeniz için yeni bir sınıf ekleyin. Çözüm Gezgini'de ProductsServer projesine sağ tıklayın ve Sınıf Ekle'yi>seçin.

  8. Ad alanına ProductsContract.cs adını girin ve Ekle'yi seçin.

Çözümünüzde aşağıdaki kod değişikliklerini yapın:

  1. ProductsContract.cs sınıfında, ad alanı tanımını hizmet sözleşmesini tanımlayan şu kod ile değiştirin:

    namespace ProductsServer
    {
        using System.Collections.Generic;
        using System.Runtime.Serialization;
        using System.ServiceModel;
    
        // Define the data contract for the service
        [DataContract]
        // Declare the serializable properties.
        public class ProductData
        {
            [DataMember]
            public string Id { get; set; }
            [DataMember]
            public string Name { get; set; }
            [DataMember]
            public string Quantity { get; set; }
        }
    
        // Define the service contract.
        [ServiceContract]
        interface IProducts
        {
            [OperationContract]
            IList<ProductData> GetProducts();
    
        }
    
        interface IProductsChannel : IProducts, IClientChannel
        {
        }
    }
    
  2. Program.cs dosyasında, ad alanı tanımını aşağıdaki kodla değiştirin. Bu kod profil hizmetini ve bunun için konağı ekler.

    namespace ProductsServer
    {
        using System;
        using System.Linq;
        using System.Collections.Generic;
        using System.ServiceModel;
    
        // Implement the IProducts interface.
        class ProductsService : IProducts
        {
    
            // Populate array of products for display on website
            ProductData[] products =
                new []
                    {
                        new ProductData{ Id = "1", Name = "Rock",
                                         Quantity = "1"},
                        new ProductData{ Id = "2", Name = "Paper",
                                         Quantity = "3"},
                        new ProductData{ Id = "3", Name = "Scissors",
                                         Quantity = "5"},
                        new ProductData{ Id = "4", Name = "Well",
                                         Quantity = "2500"},
                    };
    
            // Display a message in the service console application
            // when the list of products is retrieved.
            public IList<ProductData> GetProducts()
            {
                Console.WriteLine("GetProducts called.");
                return products;
            }
    
        }
    
        class Program
        {
            // Define the Main() function in the service application.
            static void Main(string[] args)
            {
                var sh = new ServiceHost(typeof(ProductsService));
                sh.Open();
    
                Console.WriteLine("Press ENTER to close");
                Console.ReadLine();
    
                sh.Close();
            }
        }
    }
    
  3. Çözüm Gezgini app.config dosyasına çift tıklayarak dosyayı Visual Studio düzenleyicisinde açın. öğesinin <system.ServiceModel> en altına, ancak yine de içinde <system.ServiceModel>aşağıdaki XML kodunu ekleyin.

    Önemli

    değerini ad alanınızın adıyla ve yourKey portaldan daha önce aldığınız SAS anahtarıyla değiştirinyourServiceNamespace:

      <services>
         <service name="ProductsServer.ProductsService">
           <endpoint address="sb://yourServiceNamespace.servicebus.windows.net/products" binding="netTcpRelayBinding" contract="ProductsServer.IProducts" behaviorConfiguration="products"/>
         </service>
      </services>
      <behaviors>
         <endpointBehaviors>
           <behavior name="products">
             <transportClientEndpointBehavior>
                <tokenProvider>
                   <sharedAccessSignature keyName="RootManageSharedAccessKey" key="yourKey" />
                </tokenProvider>
             </transportClientEndpointBehavior>
           </behavior>
         </endpointBehaviors>
      </behaviors>
    

    Dekont

    Bunun neden olduğu transportClientEndpointBehavior hata yalnızca bir uyarıdır ve bu örnekte engelleyici bir sorun değildir.

  4. Yine App.config dosyasındaki öğesinde <appSettings> bağlantı dizesi değerini portaldan daha önce aldığınız bağlantı dizesi değiştirin.

    <appSettings>
       <!-- Service Bus specific app settings for messaging connections -->
       <add key="Microsoft.ServiceBus.ConnectionString"
           value="Endpoint=sb://yourNamespace.servicebus.windows.net/;SharedAccessKeyName=RootManageSharedAccessKey;SharedAccessKey=yourKey"/>
    </appSettings>
    
  5. Uygulamayı derlemek ve şimdiye kadarki çalışmanızın doğruluğunu doğrulamak için Ctrl+Shift+B tuşlarına basın veya Derleme Çözümü Oluştur'a>tıklayın.

ASP.NET uygulaması oluşturma

Bu bölümde, ürün hizmetinizden alınan verileri görüntüleyen basit bir ASP.NET uygulaması oluşturacaksınız.

Proje oluşturma

  1. Visual Studio'nın yönetici olarak çalıştığından emin olun.

  2. Visual Studio'da Yeni proje oluştur'u seçin.

  3. Yeni proje oluştur bölümünde C# için ASP.NET Web Uygulaması (.NET Framework) seçeneğini belirleyin ve İleri'yi seçin.

  4. Projeye ProductsPortal adını verin ve Oluştur'u seçin.

  5. Yeni ASP.NET Web Uygulaması oluştur bölümünde MVC'yi ve Kimlik Doğrulaması'nın altında Değiştir'i seçin.

    Select ASP .NET Web Application

  6. Kimlik Doğrulamayı Değiştir'de Kimlik Doğrulaması Yok'u ve ardından Tamam'ı seçin. Bu öğreticide, kullanıcının oturum açmasına gerek olmayan bir uygulama dağıtıyorsunuz.

    Specify authentication

  7. Yeni ASP.NET Web Uygulaması oluştur bölümüne dönüp Oluştur'u seçerek MVC uygulamasını oluşturun.

  8. Yeni bir web uygulaması için Azure kaynaklarını yapılandırın. Web uygulamanızı yayımlama'daki adımları izleyin. Ardından bu öğreticiye dönün ve sonraki adıma geçin.

  9. Çözüm Gezgini'da Modeller'e sağ tıklayın ve sınıf ekle'yi> seçin.

  10. Sınıfı product.cs olarak adlandırın ve Ekle'yi seçin.

    Create Product model

Web uygulamasını değiştirme

  1. Visual Studio'daki Product.cs dosyasında var olan ad alanı tanımını aşağıdaki kodla değiştirin:

     // Declare properties for the products inventory.
     namespace ProductsWeb.Models
     {
        public class Product
        {
            public string Id { get; set; }
            public string Name { get; set; }
            public string Quantity { get; set; }
        }
     }
    
  2. Çözüm Gezgini'da Denetleyiciler'i genişletin, ardından HomeController.cs dosyasına çift tıklayarak dosyayı Visual Studio'da açın.

  3. HomeController.cs dosyasında mevcut ad alanı tanımını aşağıdaki kodla değiştirin:

    namespace ProductsWeb.Controllers
    {
        using System.Collections.Generic;
        using System.Web.Mvc;
        using Models;
    
        public class HomeController : Controller
        {
            // Return a view of the products inventory.
            public ActionResult Index(string Identifier, string ProductName)
            {
                var products = new List<Product>
                    {new Product {Id = Identifier, Name = ProductName}};
                return View(products);
            }
         }
    }
    
  4. Çözüm Gezgini,Paylaşılan Görünümler'i >genişletin, sonra dosyayı Visual Studio düzenleyicisinde açmak için _Layout.cshtml dosyasına çift tıklayın.

  5. tüm örneklerini My ASP.NET Application Northwind Traders Products olarak değiştirin.

  6. Home, Aboutve Contact bağlantılarını kaldırın. Aşağıdaki örnekte vurgulanmış kodu silin.

    Delete the generated list items

  7. Çözüm Gezgini Görünümler >Giriş'i genişletin, ardından Index.cshtml dosyasına çift tıklayarak dosyayı Visual Studio düzenleyicisinde açın. Dosyanın tüm içeriğini aşağıdaki kodla değiştirin:

    @model IEnumerable<ProductsWeb.Models.Product>
    
    @{
             ViewBag.Title = "Index";
    }
    
    <h2>Prod Inventory</h2>
    
    <table>
              <tr>
                  <th>
                      @Html.DisplayNameFor(model => model.Name)
                  </th>
                  <th></th>
                  <th>
                      @Html.DisplayNameFor(model => model.Quantity)
                  </th>
              </tr>
    
    @foreach (var item in Model) {
              <tr>
                  <td>
                      @Html.DisplayFor(modelItem => item.Name)
                  </td>
                  <td>
                      @Html.DisplayFor(modelItem => item.Quantity)
                  </td>
              </tr>
    }
    
    </table>
    
  8. Şu ana kadarki çalışmanızın doğruluğunu doğrulamak için Ctrl+Shift+B tuşlarına basarak projeyi oluşturabilirsiniz.

Uygulamayı yerel olarak çalıştırma

Çalışır durumda olduğunu doğrulamak için uygulamayı çalıştırın.

  1. ProductsPortal projesinin, etkin olduğundan emin olun. Çözüm Gezgini'da proje adına sağ tıklayın ve Başlangıç Projesi Olarak Ayarla'yı seçin.
  2. Visual Studio'da F5'i seçin.

Uygulamanız, bir tarayıcıda çalışıyor olarak görüntülenmelidir.

Screenshot shows an example of the application running in a browser with the URL highlighted.

Parçaları bir araya getirme

Sonraki adım, şirket içi ürünlerin sunucusu ile ASP.NET uygulamasını birleştirmektir.

  1. Henüz açık değilse Visual Studio'da, ASP.NET uygulaması oluşturma bölümünde oluşturduğunuz ProductsPortal projesini açın.

  2. Şirket içi sunucu oluşturma bölümündeki adıma benzer şekilde, NuGet paketini proje başvurularına ekleyin. Çözüm Gezgini'da ProductsPortal projesine sağ tıklayıp NuGet Paketlerini Yönet'i seçin.

  3. WindowsAzure.ServiceBus araması yapın ve WindowsAzure.ServiceBus öğesini seçin. Ardından yüklemeyi tamamlayın ve bu iletişim kutusunu kapatın.

  4. Çözüm Gezgini'da ProductsPortal projesine sağ tıklayın, ardından Varolan ÖğeYi Ekle'yi>seçin.

  5. ProductsServer konsol projesinden ProductsContract.cs dosyasına gidin. ProductsContract.cs dosyasını vurgulayın. Ekle'nin yanındaki aşağı oku ve ardından Bağlantı Olarak Ekle'yi seçin.

    Add as a link

  6. Şimdi, Visual Studio düzenleyicisinde HomeController.cs dosyasını açın ve ad alanı tanımını aşağıdaki kodla değiştirin. değerini Relay ad alanınızın adıyla ve yourKey SAS anahtarınızla değiştirerek değiştirmeyi yourServiceNamespace unutmayın. Bu kod, istemcinin şirket içi hizmeti çağırarak çağrının sonucunu döndürmesini sağlar.

    namespace ProductsWeb.Controllers
    {
        using System.Linq;
        using System.ServiceModel;
        using System.Web.Mvc;
        using Microsoft.ServiceBus;
        using Models;
        using ProductsServer;
    
        public class HomeController : Controller
        {
            // Declare the channel factory.
            static ChannelFactory<IProductsChannel> channelFactory;
    
            static HomeController()
            {
                // Create shared access signature token credentials for authentication.
                channelFactory = new ChannelFactory<IProductsChannel>(new NetTcpRelayBinding(),
                    "sb://yourServiceNamespace.servicebus.windows.net/products");
                channelFactory.Endpoint.Behaviors.Add(new TransportClientEndpointBehavior {
                    TokenProvider = TokenProvider.CreateSharedAccessSignatureTokenProvider(
                        "RootManageSharedAccessKey", "yourKey") });
            }
    
            public ActionResult Index()
            {
                using (IProductsChannel channel = channelFactory.CreateChannel())
                {
                    // Return a view of the products inventory.
                    return this.View(from prod in channel.GetProducts()
                                     select
                                         new Product { Id = prod.Id, Name = prod.Name,
                                             Quantity = prod.Quantity });
                }
            }
        }
    }
    
  7. Çözüm Gezgini'da ProductsPortal çözümüne sağ tıklayın. Projeye değil çözüme sağ tıkladığından emin olun. Var Olan Projeyi Ekle'yi>seçin.

  8. ProductsServer projesine gidip ProductsServer.csproj çözümüne çift tıklayarak ekleyin.

  9. ProductsPortal'da verileri görüntülemek için ProductsServer'ın çalışıyor olması gerekir. Çözüm Gezgini'da ProductsPortal çözümüne sağ tıklayın ve Özellik Sayfalarını görüntülemek için Özellikler'i seçin.

  10. Ortak Özellikler>Başlangıç Projesi'ni ve birden çok başlangıç projesi'ni seçin. ProductsServer ve ProductsPortal'ınbu sırada göründüğünden ve her ikisi için de Eylemin Başlat olduğundan emin olun.

    Multiple startup projects

  11. Sol taraftaki Ortak Özellikler>Proje Bağımlılıkları'nı seçin.

  12. Projeler için ÜrünlerPortal'ı seçin. ProductsServer projesinin seçili olduğundan emin olun.

    Project dependencies

  13. Projeler için ProductsServer'ı seçin. ProductsPortal öğesinin seçili olmadığından emin olun ve değişikliklerinizi kaydetmek için Tamam'ı seçin.

Projeyi yerel olarak çalıştırma

Uygulamayı yerel olarak test etmek için Visual Studio'da F5'i seçin. Şirket içi sunucu olan ProductsServer ilk olarak başlatılmalıdır, ardından ProductsPortal uygulaması bir tarayıcı penceresinde başlatılmalıdır. Bu kez, ürün envanterinin şirket içi ürün hizmetinden alınan verileri listelediğini görürsünüz.

Web application

ProductsPortal sayfasında Yenile'yi seçin. Sayfayı her yenilediğinizde, ProductsServer'dan çağrıldığında GetProducts() sunucu uygulamasının bir ileti görüntülediğini görürsünüz.

Sonraki bölüme geçmeden önce her iki uygulamayı da kapatın.

ProductsPortal projesini bir Azure web uygulamasına dağıtma

Sonraki adım, Azure Web uygulaması ProductsPortal ön ucunu yeniden yayımlamaktır:

  1. Çözüm Gezgini'da ProductsPortal projesine sağ tıklayın ve Yayımla'yı seçin. Yayımla sayfasında Yayımla’yı seçin.

    Dekont

    Dağıtımdan sonra ProductsPortal web projesinin otomatik olarak başlatılması durumunda tarayıcıda bir hata iletisi görüntülenebilir. ProductsServer uygulaması henüz çalışmadığından bu durumun meydana gelmesi olasıdır.

  2. Dağıtılan web uygulamasının URL'sini kopyalayın. URL'ye daha sonra ihtiyacınız olacak. Bu URL'yi Visual Studio'daki Azure Uygulaması Hizmet Etkinliği penceresinden de alabilirsiniz:

    URL of the deployed app

  3. Çalışan uygulamayı durdurmak için tarayıcı penceresini kapatın.

Uygulamayı bulutta çalıştırmadan önce, ProductsPortal'ın Visual Studio'dan bir web uygulaması olarak başlatıldığından emin olmanız gerekir.

  1. Visual Studio'da ProductsPortal projesine sağ tıklayın ve Özellikler'i seçin.

  2. Web seçeneğini belirleyin. Başlat Eylemi'nin altında Başlangıç URL'sini seçin. Bu örnekte https://productsportal20190906122808.azurewebsites.net/, daha önce dağıtılan web uygulamanızın URL'sini girin.

    Start URL

  3. Dosya>Tümünü Kaydet'i seçin.

  4. Derleme>Yeniden Derleme Çözümü'ne tıklayın.

Uygulamayı çalıştırma

Uygulamayı derlemek ve çalıştırmak için F5'i seçin. ProductsServer konsol uygulaması olan şirket içi sunucu önce başlamalıdır, ardından ProductsPortal uygulaması burada gösterildiği gibi bir tarayıcı penceresinde başlamalıdır:

Run the web app on Azure

Ürün envanteri, şirket içi ürün hizmeti sisteminden alınan verileri listeler ve bu verileri web uygulamasında görüntüler. ProductsPortal'ın bir Azure web uygulaması olarak bulutta çalıştığından emin olmak için URL'yi kontrol edin.

Önemli

ProductsServer konsol uygulamasının çalışır ve ProductsPortal uygulamasına veri sunma işlemini gerçekleştirebilir durumda olması gerekir. Tarayıcı bir hata görüntülerse, ProductsServer'ın yüklenmesi ve aşağıdaki iletiyi görüntülemesi için birkaç saniye daha bekleyin, ardından tarayıcıyı yenileyin.

Tarayıcıda ProductsPortal sayfasını yenileyin. Sayfayı her yenilediğinizde, ProductsServer'dan çağrıldığında GetProducts() sunucu uygulamasının bir ileti görüntülediğini görürsünüz.

Updated output

Sonraki adımlar

Şu öğreticiye ilerleyin: