hızlı başlangıç: C kullanarak Azure işlevleri ve signalr hizmeti ile GitHub star sayısını gösteren bir uygulama oluşturma#

Azure SignalR hizmeti uygulamanıza kolayca gerçek zamanlı işlevsellik eklemenizi sağlar. Azure İşlevleri, herhangi bir altyapı yönetimine gerek kalmadan kodunuzu çalıştırmanıza olanak tanıyan sunucusuz bir platformdur. Bu hızlı başlangıçta, istemcilere ileti yayınlamak Için bkz. SignalR hizmeti ve Azure Işlevlerini kullanarak C# ile sunucusuz bir uygulama oluşturma hakkında bilgi edinin.

Önkoşullar

zaten yüklü Visual Studio Code yoksa ücretsiz olarak indirip kullanabilirsiniz ( https://code.visualstudio.com/Download) .

bu öğreticiyi, komut satırında (macos, Windows veya Linux) Azure Functions Core Tools)kullanarak da çalıştırabilirsiniz. Ayrıca .NET Core SDKve en sevdiğiniz kod düzenleyiciniz.

Azure aboneliğiniz yoksa başlamadan önce ücretsiz olarak bir tane oluşturun .

Sorun mu yaşıyorsunuz? Sorun giderme kılavuzunu deneyin veya bize bilgi verin.

Azure 'da oturum açma ve SignalR hizmet örneği oluşturma

Azure hesabınızla Azure portalında https://portal.azure.com/ sayfasında oturum açın.

Sorun mu yaşıyorsunuz? Sorun giderme kılavuzunu deneyin veya bize bilgi verin.

Azure SignalR Hizmeti örneği oluşturma

Uygulamanız Azure’da bir SignalR hizmeti örneğine bağlanır.

1. Azure portalın sol üst köşesinde bulunan Yeni düğmesini seçin. Yeni ekranda arama kutusuna SignalR hizmeti yazın ve Enter tuşuna basın.

   

2. Arama sonuçlarından SignalR Hizmeti’ni seçtikten sonra Oluştur’u seçin.

3. Aşağıdaki ayarları girin.

   Ayar	Önerilen değer	Açıklama
   Kaynak adı	Genel olarak benzersiz bir ad	Yeni SignalR Hizmeti örneğinizi tanımlayan ad. Geçerli karakterler: a-z, 0-9 ve -.
   Abonelik	Aboneliğiniz	Yeni SignalR Hizmeti örneğinin oluşturulacağı abonelik.
   Kaynak Grubu	myResourceGroup	SignalR Hizmeti örneğinizin oluşturulacağı yeni kaynak grubunun adı.
   Konum	Batı ABD	Size yakın bir bölge seçin.
   Fiyatlandırma katmanı	Ücretsiz	Azure SignalR Hizmetini ücretsiz deneyin.
   Birim sayısı	Uygulanamaz	Birim sayısı, SignalR Hizmeti örneğinizin kaç bağlantı kabul edebileceğini belirtir. Bu yalnızca Standart katmanda yapılandırılabilir.
   Hizmet modu	Sunucusuz	Azure Işlevleri veya REST API kullanmak için.

   

4. SignalR Hizmeti örneğini dağıtmaya başlamak için Oluştur’u seçin.

5. Örnek dağıtıldıktan sonra portalda açın ve ayarlar sayfasını bulun. Azure SignalR hizmetini Azure Işlevleri bağlama veya REST API aracılığıyla kullanıyorsanız, hizmet modu ayarını sunucusuz olarak değiştirin. Aksi halde Klasik veya varsayılan olarak bırakın.

Sorun mu yaşıyorsunuz? Sorun giderme kılavuzunu deneyin veya bize bilgi verin.

Azure Işlevini yerel olarak kurma ve çalıştırma

1. Azure Function Core araçlarının yüklü olduğundan emin olun. Ve boş bir dizin oluşturun ve komut satırı ile dizine gidin.

   # Initialize a function project
   func init --worker-runtime dotnet
   
   # Add SignalR Service package reference to the project
   dotnet add package Microsoft.Azure.WebJobs.Extensions.SignalRService
   

2. Bir projeyi başlattıktan sonra. Function. cs adlı yeni bir dosya oluşturun. Aşağıdaki kodu function. cs öğesine ekleyin.

   using System;
   using System.IO;
   using System.Net.Http;
   using System.Threading.Tasks;
   using Microsoft.AspNetCore.Http;
   using Microsoft.AspNetCore.Mvc;
   using Microsoft.Azure.WebJobs;
   using Microsoft.Azure.WebJobs.Extensions.Http;
   using Microsoft.Azure.WebJobs.Extensions.SignalRService;
   using Newtonsoft.Json;
   
   namespace CSharp
   {
       public static class Function
       {
           private static HttpClient httpClient = new HttpClient();
   
           [FunctionName("index")]
           public static IActionResult Index([HttpTrigger(AuthorizationLevel.Anonymous)]HttpRequest req, ExecutionContext context)
           {
               var path = Path.Combine(context.FunctionAppDirectory, "content", "index.html");
               return new ContentResult
               {
                   Content = File.ReadAllText(path),
                   ContentType = "text/html",
               };
           }
   
           [FunctionName("negotiate")]
           public static SignalRConnectionInfo Negotiate( 
               [HttpTrigger(AuthorizationLevel.Anonymous)] HttpRequest req,
               [SignalRConnectionInfo(HubName = "serverlessSample")] SignalRConnectionInfo connectionInfo)
           {
               return connectionInfo;
           }
   
           [FunctionName("broadcast")]
           public static async Task Broadcast([TimerTrigger("*/5 * * * * *")] TimerInfo myTimer,
           [SignalR(HubName = "serverlessSample")] IAsyncCollector<SignalRMessage> signalRMessages)
           {
               var request = new HttpRequestMessage(HttpMethod.Get, "https://api.github.com/repos/azure/azure-signalr");
               request.Headers.UserAgent.ParseAdd("Serverless");
               var response = await httpClient.SendAsync(request);
               var result = JsonConvert.DeserializeObject<GitResult>(await response.Content.ReadAsStringAsync());
               await signalRMessages.AddAsync(
                   new SignalRMessage
                   {
                       Target = "newMessage",
                       Arguments = new[] { $"Current star count of https://github.com/Azure/azure-signalr is: {result.StarCount}" }
                   });
           }
   
           private class GitResult
           {
               [JsonRequired]
               [JsonProperty("stargazers_count")]
               public string StarCount { get; set; }
           }
       }
   }
   

   Bu kodların üç işlevi vardır. , Index Bir Web sitesini istemci olarak almak için kullanılır. , Negotiate İstemcisinin erişim belirtecini alması için kullanılır. , Broadcast düzenli aralıklarla GitHub ve tüm istemcilere yayın iletilerinden yıldız sayısı alır.

3. Bu örneğin istemci arabirimi bir Web sayfasıdır. İşlevin içindeki HTML içeriğini okuduk content/index.html GetHomePage , index.html content Proje kök klasörü altında dizinde yeni bir dosya oluşturun. Ve aşağıdaki içeriği kopyalayın.

   <html>
   
   <body>
     <h1>Azure SignalR Serverless Sample</h1>
     <div id="messages"></div>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/microsoft-signalr/3.1.7/signalr.min.js"></script>
     <script>
       let messages = document.querySelector('#messages');
       const apiBaseUrl = window.location.origin;
       const connection = new signalR.HubConnectionBuilder()
           .withUrl(apiBaseUrl + '/api')
           .configureLogging(signalR.LogLevel.Information)
           .build();
         connection.on('newMessage', (message) => {
           document.getElementById("messages").innerHTML = message;
         });
   
         connection.start()
           .catch(console.error);
     </script>
   </body>
   
   </html>
   

4. *.csprojDerleme çıkış klasörü içinde içerik sayfasını yapmak için hesabınızı güncelleştirin.

   <ItemGroup>
     <None Update="content/index.html">
       <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
     </None>
   </ItemGroup>
   

5. Artık neredeyse bitti. Son adım, SignalR hizmetinin bir bağlantı dizesini Azure Işlev ayarlarına ayarındır.

   1. Azure portalın açık olduğu tarayıcıda portalın üst kısmındaki arama kutusundan adını arayarak önceden dağıttığınız SignalR Hizmeti örneğinin başarılı bir şekilde oluşturulduğundan emin olun. Açmak için örneği seçin.

      

   2. SignalR Hizmeti örneğinin bağlantı dizelerini görüntülemek için Anahtarlar’ı seçin.

      

   3. Birincil bağlantı dizesini kopyalayın. Ve aşağıdaki komutu yürütün.

      func settings add AzureSignalRConnectionString "<signalr-connection-string>"
      

6. Azure Işlevini yerel olarak çalıştırın:

   func start
   

   Azure Işlevi yerel olarak çalıştırıldıktan sonra. Tarayıcınızı kullanarak, ziyaret edin http://localhost:7071/api/index ve geçerli yıldız sayısını görebilirsiniz. GitHub yıldızı veya yıldız işaretini alırsanız, birkaç saniyede bir yıldız sayısı yenileme alırsınız.

   Not

   signalr bağlamasının Azure Depolama gerekir, ancak işlev yerel olarak çalışırken yerel depolama öykünücüsünü kullanabilirsiniz. There was an error performing a read operation on the Blob Storage Secret Repository. Please ensure the 'AzureWebJobsStorage' connection string is valid.Depolama indirmeniz ve etkinleştirmeniz gerektiği için bir hata oluştu Emulator

Sorun mu yaşıyorsunuz? Sorun giderme kılavuzunu deneyin veya bize bilgi verin

Kaynakları temizleme

Bu uygulamayı kullanmaya devam etmeyecekseniz, herhangi bir ücret ödememek için aşağıdaki adımları kullanarak bu hızlı başlangıç tarafından oluşturulan tüm kaynakları silin:

1. Azure portalında, en solda bulunan Kaynak grupları’nı ve ardından oluşturduğunuz kaynak grubunu seçin. Alternatif olarak kaynak grubunu adıyla bulmak için arama kutusunu kullanabilirsiniz.

2. Açılan pencerede kaynak grubunu seçin ve Kaynak grubunu sil’e tıklayın.

3. Yeni pencerede, silmek için kaynak grubunun adını yazıp Sil öğesine tıklayın.

Sorun mu yaşıyorsunuz? Sorun giderme kılavuzunu deneyin veya bize bilgi verin.

Sonraki adımlar

Bu hızlı başlangıçta yerel olarak gerçek zamanlı sunucusuz bir uygulama oluşturup çalıştırdınız. Azure Işlevleri için SignalR hizmeti bağlamalarını kullanma hakkında daha fazla bilgi edinin. Daha sonra, SignalR hizmeti ile istemciler ve Azure Işlevleri arasında nasıl iletişim kurdukları hakkında daha fazla bilgi edinin.