Azure Digital Twins'i Azure SignalR Hizmeti ile tümleştirme

Bu makalede Azure Digital Twins'i Azure SignalR Hizmeti ile tümleştirmeyi öğreneceksiniz.

Bu makalede açıklanan çözüm, tek bir web sayfası veya mobil uygulama gibi bağlı istemcilere dijital ikiz telemetri verilerini göndermenizi sağlar. Sonuç olarak istemciler, sunucuyu yoklama veya güncelleştirmeler için yeni HTTP istekleri göndermeye gerek kalmadan IoT cihazlarından gerçek zamanlı ölçümler ve durumlarla güncelleştirilir.

Önkoşullar

Devam etmeden önce tamamlamanız gereken önkoşullar şunlardır:

• Çözümünüzü bu makaledeki Azure SignalR Hizmeti tümleştirmeden önce, uçtan uca çözüm Bağlan Azure Digital Twins'i tamamlamanız gerekir çünkü bu nasıl yapılır makalesi bunun üzerine derleniyor. Öğretici, dijital ikiz güncelleştirmelerini tetikleme amacıyla sanal IoT cihazıyla çalışan bir Azure Digital Twins örneği ayarlama konusunda size yol gösterir. Bu nasıl yapılır makalesi, Azure SignalR Hizmeti kullanarak bu güncelleştirmeleri örnek bir web uygulamasına bağlar.

• Öğreticide aşağıdaki değerlere ihtiyacınız olacaktır:

  • Event Grid konusu
  • Kaynak grubu
  • App Service/işlev uygulaması adı

• Makinenizde Node.js dosyasının yüklü olması gerekir.

Bu kılavuzda kullanmanız gerektiğinden Azure portalında Azure hesabınızla oturum açtığınızdan emin olun.

Çözüm mimarisi

Aşağıdaki yol üzerinden Azure Digital Twins'e Azure SignalR Hizmeti ekleyeceksiniz. Diyagramdaki A, B ve C bölümleri, uçtan uca öğretici önkoşulunun mimari diyagramından alınmıştır. Bu nasıl yapılır makalesinde, SignalR ve istemci uygulamalarıyla iletişim kuran iki yeni Azure işlevi içeren mevcut mimarinin D bölümünü oluşturacaksınız.

Örnek uygulamaları indirme

İlk olarak gerekli örnek uygulamaları indirin. Aşağıdaki örneklerin her ikisi de gerekir:

• Azure Digital Twins uçtan uca örnekler: Bu örnek, bir Azure Digital Twins örneğinde verileri taşımak için iki Azure işlevini barındıran bir AdtSampleApp içerir (bu senaryo hakkında uçtan uca çözüm Bağlan daha ayrıntılı bilgi edinebilirsiniz). Ayrıca ioT cihazının benzetimini yaparak her saniye yeni bir sıcaklık değeri oluşturan bir DeviceSimulator örnek uygulaması içerir.

  • Önkoşullar'daki öğreticinin bir parçası olarak örneği henüz indirmediyseniz örneğe gidin ve başlığın altındaki Koda gözat düğmesini seçin. Bunu yaptığınızda örneklerin GitHub deposuna gidebilirsiniz. Bu depoyu Kod düğmesini ve ZIP'i İndir'i seçerek .zip olarak indirebilirsiniz.

    

  Bu düğme makinenizdeki örnek deponun bir kopyasını digital-twins-samples-main.zip olarak indirir. Klasörün sıkıştırmasını açın.

• SignalR tümleştirmesi web uygulaması örneği: Bu örnek React web uygulaması bir Azure SignalR Hizmeti Azure Digital Twins telemetri verilerini tüketir.

  • Örnek bağlantıya gidin ve örneğin kopyasını makinenize indirmek için digitaltwins-signalr-webapp-sample-main.zip ile aynı indirme işlemini kullanın. Klasörün sıkıştırmasını açın.

Bu bölümde, uygulamanız için kullanılacak temel bir Azure SignalR örneği oluşturacaksınız. Aşağıdaki adımlarda yeni bir örnek oluşturmak için Azure portalı kullanılır, ancak Azure CLI'yı da kullanabilirsiniz. Daha fazla bilgi için Azure SignalR Hizmeti CLI Başvurusu'ndaki az signalr create komutuna bakın.

1. Azure Portal oturum açın.
2. Sayfanın sol üst kısmında + Kaynak oluştur'u seçin.
3. Kaynak oluştur sayfasında, Arama hizmeti s ve market metin kutusuna signalr yazın ve listeden SignalR Hizmeti seçin.
4. SignalR Hizmeti sayfasında Oluştur'u seçin.
5. Temel Bilgiler sekmesinde, yeni SignalR Hizmeti örneğinin temel bilgilerini girersiniz. Aşağıdaki değerleri girin:

Alan	Önerilen Değer	Açıklama
Abonelik	Aboneliğinizi seçin	Yeni bir SignalR Hizmeti örneği oluşturmak için kullanmak istediğiniz aboneliği seçin.
Kaynak grubu	SignalRTestResources adlı bir kaynak grubu oluşturma	SignalR kaynağınız için bir kaynak grubu seçin veya oluşturun. Mevcut bir kaynak grubunu kullanmak yerine bu öğretici için yeni bir kaynak grubu oluşturmak yararlı olur. Öğreticiyi tamamladıktan sonra kaynakları boşaltmak için kaynak grubunu silin. Bir kaynak grubunun silinmesi, gruba ait olan tüm kaynakları da siler. Bu eylem geri alınamaz. Bir kaynak grubunu silmeden önce, tutmak istediğiniz kaynakları içermediğinden emin olun. Daha fazla bilgi için bkz. Azure kaynaklarınızı yönetmek için kaynak gruplarını kullanma.
Kaynak adı	testsignalr	SignalR kaynağı için kullanılacak benzersiz kaynak adını girin. Testsignalr bölgenizde zaten alınmışsa, ad benzersiz olana kadar bir basamak veya karakter ekleyin. Ad 1 ile 63 karakter arasında bir dize olmalı ve yalnızca sayı, harf ve kısa çizgi (-) karakteri içermelidir. Ad kısa çizgi karakteriyle başlayamaz veya bitemez ve ardışık kısa çizgi karakterleri geçerli değildir.
Bölge	Bölgenizi seçin	Yeni SignalR Hizmeti örneğiniz için uygun bölgeyi seçin. Azure SignalR Hizmeti şu anda tüm bölgelerde kullanılamamaktadır. Daha fazla bilgi için bkz. Azure SignalR Hizmeti bölge kullanılabilirliği
Fiyatlandırma katmanı	Değiştir'i ve ardından Ücretsiz (Yalnızca Geliştirme/Test) seçeneğini belirleyin. Fiyatlandırma katmanı seçiminizi onaylamak için Seç'i seçin.	Azure SignalR Hizmeti üç fiyatlandırma katmanı vardır: Ücretsiz, Standart ve Premium. Öğreticiler, önkoşullarda aksi belirtilmedikçe Ücretsiz katmanını kullanır. Katmanlar ve fiyatlandırma arasındaki işlevsellik farkları hakkında daha fazla bilgi için bkz. fiyatlandırma Azure SignalR Hizmeti
Hizmet modu	Uygun hizmet modunu seçin	Web uygulamalarınızda SignalR hub mantığını barındırırken ve SignalR hizmetini ara sunucu olarak kullanırken Varsayılan'ı kullanın. SignalR hub mantığını barındırmak için Azure İşlevleri gibi Sunucusuz teknolojileri kullanırken Sunucusuz'u kullanın. Klasik mod yalnızca geriye dönük uyumluluk içindir ve kullanılması önerilmez. Daha fazla bilgi için bkz. Azure SignalR Hizmeti'de hizmet modu.

SignalR öğreticileri için Ağ ve Etiketler sekmelerindeki ayarları değiştirmeniz gerekmez.

6. Temel Bilgiler sekmesinin en altındaki Gözden Geçir + oluştur düğmesini seçin.
7. Gözden geçir ve oluştur sekmesinde değerleri gözden geçirin ve Oluştur'u seçin. Dağıtımın tamamlanması birkaç dakika sürer.
8. Dağıtım tamamlandığında Kaynağa git düğmesini seçin.
9. SignalR kaynağı sayfasında, soldaki menüden Ayarlar altında Anahtarlar'ı seçin.
10. Birincil anahtar için Bağlan ion dizesini kopyalayın. Bu öğreticinin ilerleyen bölümlerinde uygulamanızı yapılandırmak için bu bağlantı dizesi gerekir.

Sonraki bölümde yeniden kullanacağınız için tarayıcı penceresini Azure portalında açık bırakın.

Azure İşlevleri uygulamasını yayımlama ve yapılandırma

Bu bölümde iki Azure işlevi ayarlayacaksınız:

• negotiate - HTTP tetikleyici işlevi. Geçerli bağlantı bilgilerini oluşturmak ve döndürmek için SignalR Bağlan ionInfo giriş bağlamasını kullanır.
• broadcast - Event Grid tetikleyici işlevi. Olay kılavuzu aracılığıyla Azure Digital Twins telemetri verilerini alır ve iletiyi tüm bağlı istemci uygulamalarına yayınlamak için önceki adımda oluşturduğunuz SignalR örneğinin çıkış bağlamasını kullanır.

Visual Studio'yu veya istediğiniz başka bir kod düzenleyicisini başlatın ve kod çözümünü digital-twins-samples-main\ADTSampleApp klasöründe açın. Ardından işlevleri oluşturmak için aşağıdaki adımları uygulayın:

1. SampleFunctionsApp projesinde SignalRFunctions.cs adlı yeni bir C# sınıfı oluşturun.

2. Sınıf dosyasının içeriğini aşağıdaki kodla değiştirin:

   using System;
   using System.Collections.Generic;
   using System.Threading.Tasks;
   using Microsoft.AspNetCore.Http;
   using Microsoft.Azure.WebJobs;
   using Microsoft.Azure.WebJobs.Extensions.Http;
   using Microsoft.Azure.WebJobs.Extensions.EventGrid;
   using Microsoft.Azure.WebJobs.Extensions.SignalRService;
   using Microsoft.Extensions.Logging;
   using Newtonsoft.Json;
   using Newtonsoft.Json.Linq;
   using Azure.Messaging.EventGrid;
   
   namespace SignalRFunction
   {
       public static class SignalRFunctions
       {
           public static double temperature;
   
           [FunctionName("negotiate")]
           public static SignalRConnectionInfo GetSignalRInfo(
               [HttpTrigger(AuthorizationLevel.Anonymous, "post")] HttpRequest req,
               [SignalRConnectionInfo(HubName = "dttelemetry")] SignalRConnectionInfo connectionInfo)
           {
               return connectionInfo;
           }
   
           [FunctionName("broadcast")]
           public static Task SendMessage(
               [EventGridTrigger] EventGridEvent eventGridEvent,
               [SignalR(HubName = "dttelemetry")] IAsyncCollector<SignalRMessage> signalRMessages,
               ILogger log)
           {
               JObject eventGridData = (JObject)JsonConvert.DeserializeObject(eventGridEvent.Data.ToString());
   
               log.LogInformation($"Event grid message: {eventGridData}");
   
               var patch = (JObject)eventGridData["data"]["patch"][0];
               if (patch["path"].ToString().Contains("/Temperature"))
               {
                   temperature = Math.Round(patch["value"].ToObject<double>(), 2);
               }
   
               var message = new Dictionary<object, object>
               {
                   { "temperatureInFahrenheit", temperature},
               };
   
               return signalRMessages.AddAsync(
                   new SignalRMessage
                   {
                       Target = "newMessage",
                       Arguments = new[] { message }
                   });
           }
       }
   }
   

3. Visual Studio'nun Paket Yöneticisi Konsolu penceresinde veya makinenizdeki herhangi bir komut penceresinde digital-twins-samples-main\AdtSampleApp\SampleFunctionsApp klasörüne gidin ve NuGet paketini projeye yüklemek SignalRService için aşağıdaki komutu çalıştırın:

   dotnet add package Microsoft.Azure.WebJobs.Extensions.SignalRService --version 1.2.0
   

   Bu komutun çalıştırılması, sınıfındaki bağımlılık sorunlarını çözmelidir.

4. tercih ettiğiniz yöntemi kullanarak işlevi Azure'da yayımlayın.

   İşlevi Visual Studio kullanarak yayımlama yönergeleri için bkz. Visual Studio kullanarak Azure İşlevleri geliştirme. İşlevi Visual Studio Code kullanarak yayımlama yönergeleri için bkz. Visual Studio Code kullanarak Azure'da C# işlevi oluşturma. İşlevi Azure CLI kullanarak yayımlama yönergeleri için bkz. Komut satırından Azure'da C# işlevi oluşturma.

İşlevi yapılandırma

Ardından işlevi Azure SignalR örneğinle iletişim kuracak şekilde yapılandırın. İlk olarak SignalR örneğinin bağlantı dizesi toplayıp işlev uygulamasının ayarlarına ekleyeceksiniz.

1. Azure portalına gidin ve portalın üst kısmındaki arama çubuğunda SignalR örneğinizin adını arayın. Açmak için örneği seçin.

2. SignalR hizmet örneğinin bağlantı dizesi görüntülemek için örnek menüsünden Anahtarlar'ı seçin.

3. Birincil BAĞLANTI DIZESİ'ni kopyalamak için Kopyala simgesini seçin.

   

4. Son olarak, aşağıdaki Azure CLI komutunu kullanarak Azure SignalR bağlantı dizesi işlevin uygulama ayarlarına ekleyin. Ayrıca, öğretici önkoşulundaki yer tutucuları kaynak grubunuz ve app service/function uygulama adınızla değiştirin. Komut Azure Cloud Shell'de veya makinenizde Azure CLI yüklüyse yerel olarak çalıştırılabilir:

   az functionapp config appsettings set --resource-group <your-resource-group> --name <your-function-app-name> --settings "AzureSignalRConnectionString=<your-Azure-SignalR-ConnectionString>"
   

   Bu komutun çıktısı, Azure işleviniz için ayarlanan tüm uygulama ayarlarını yazdırır. Eklendiğini doğrulamak için AzureSignalRConnectionString listenin en altına bakın.

   

İşlevi Event Grid'e Bağlan

Ardından, azure yayın işlevini öğretici önkoşulu sırasında oluşturduğunuz Event Grid konusuna abone olun. Bu eylem telemetri verilerinin Termostat67 ikizinden Event Grid konusu aracılığıyla ve işlevine akmasına olanak tanır. İşlev buradan verileri tüm istemcilere yayınlayabilir.

Verileri yayınlamak için Event Grid konu başlığınızdan azure yayın işlevinize uç nokta olarak bir Olay aboneliği oluşturacaksınız.

Azure portalında, üstteki arama çubuğunda adını arayarak Event Grid konu başlığınıza gidin. + Olay Aboneliği'ni seçin.

Olay Aboneliği Oluştur sayfasında, alanları aşağıdaki gibi doldurun (varsayılan olarak doldurulan alanlardan bahsedilmiyor):

• OLAY ABONELİĞİ AYRINTILARI>Ad: Olay aboneliğinize bir ad verin.
• UÇ NOKTA AYRINTILARI>Uç Nokta Türü: Menü seçeneklerinden Azure İşlevi'ni seçin.
• UÇ NOKTA AYRINTILARI>Uç nokta: Uç nokta seçin bağlantısını seçerek Azure İşlevini Seçin penceresi açılır:
  • Aboneliğinizi, Kaynak grubunuzu, İşlev uygulamanızı ve İşlevinizi (yayın) doldurun. Bu alanlardan bazıları aboneliği seçtikten sonra otomatik olarak doldurulabilir.
  • Seçimi Onayla'yı seçin.

Olay Aboneliği Oluştur sayfasına dönüp Oluştur'u seçin.

Bu noktada, Event Grid Konusu sayfasında iki olay aboneliği görmeniz gerekir.

Web uygulamasını yapılandırma ve çalıştırma

Bu bölümde, sonucun nasıl çalıştığını göreceksiniz. İlk olarak, ayarladığınız Azure SignalR akışına bağlanmak için örnek istemci web uygulamasını yapılandırın. Ardından, Azure Digital Twins örneğiniz aracılığıyla cihaz telemetri verilerini gönderen sanal cihaz örnek uygulamasını başlatacaksınız. Bundan sonra, örnek web uygulamasını gerçek zamanlı olarak güncelleştiren sanal cihaz verilerini görmek için örnek web uygulamasını görüntüleyeceksiniz.

Örnek istemci web uygulamasını yapılandırma

Ardından örnek istemci web uygulamasını yapılandıracaksınız. Anlaşma işlevinin HTTP uç nokta URL'sini toplayarak başlayın ve ardından makinenizdeki uygulama kodunu yapılandırmak için bunu kullanın.

1. Azure portalının İşlev uygulamaları sayfasına gidin ve listeden işlev uygulamanızı seçin. Uygulama menüsünde İşlevler'i seçin ve negotiate işlevini seçin.

   

2. İşlev URL'sini al'ı seçin ve değeri /api aracılığıyla yukarı kopyalayın (son /negotiate? öğesini eklemeyin). Sonraki adımda bu değeri kullanacaksınız.

   

3. Visual Studio'yu veya istediğiniz herhangi bir kod düzenleyicisini kullanarak Örnek uygulamaları indirme bölümünde indirdiğiniz sıkıştırmasız digitaltwins-signalr-webapp-sample-main klasörünü açın.

4. src/App.js dosyasını açın ve içindeki işlev URL'sini HubConnectionBuilder önceki adımda kaydettiğiniz negotiate işlevinin HTTP uç nokta URL'si ile değiştirin:

       const hubConnection = new HubConnectionBuilder()
           .withUrl('<Function-URL>')
           .build();
   

5. Visual Studio'nun Geliştirici komut isteminde veya makinenizdeki herhangi bir komut penceresinde digitaltwins-signalr-webapp-sample-main\src klasörüne gidin. Bağımlı düğüm paketlerini yüklemek için aşağıdaki komutu çalıştırın:

   npm install
   

Ardından, Azure portalında işlev uygulamanızda izinleri ayarlayın:

1. Azure portalının İşlev uygulamaları sayfasında işlev uygulaması örneğinizi seçin.

2. Örnek menüsünde aşağı kaydırın ve CORS'yi seçin. CORS sayfasında, boş kutuya girerek izin verilen kaynak olarak ekleyin http://localhost:3000 . Access-Control-Allow-Credentials'ı etkinleştir kutusunu işaretleyin ve Kaydet'i seçin.

   

Cihaz simülatörünü çalıştırma

Uçtan uca öğretici önkoşulu sırasında cihaz simülatörünü bir IoT Hub üzerinden ve Azure Digital Twins örneğinize veri gönderecek şekilde yapılandırmışsınız.

Şimdi digital-twins-samples-main\DeviceSimulator\DeviceSimulator.sln konumundaki simülatör projesini başlatın. Visual Studio kullanıyorsanız, projeyi açabilir ve araç çubuğunda şu düğmeyle çalıştırabilirsiniz:

Bir konsol penceresi açılır ve sanal cihaz sıcaklığı telemetri iletileri görüntülenir. Bu iletiler Azure Digital Twins örneğiniz aracılığıyla gönderilir ve burada Azure işlevleri ve SignalR tarafından alınır.

Bu konsolda başka bir şey yapmanız gerekmez, ancak sonraki adımı tamamlarken bu işlemi çalışır durumda bırakın.

Sonuçları görme

Sonuçların nasıl çalıştığını görmek için SignalR tümleştirme web uygulaması örneğini başlatın. Bunu, digitaltwins-signalr-webapp-sample-main\src konumundaki herhangi bir konsol penceresinden şu komutu çalıştırarak yapabilirsiniz:

npm start

Bu komutun çalıştırılması örnek uygulamayı çalıştıran ve görsel sıcaklık ölçer görüntüleyen bir tarayıcı penceresi açar. Uygulama çalıştırıldıktan sonra, Azure Digital Twins aracılığıyla yayılan cihaz simülatöründeki sıcaklık telemetri değerlerinin web uygulaması tarafından gerçek zamanlı olarak yansıtıldığını görmeye başlamalısınız.

Kaynakları temizleme

Bu makalede oluşturulan kaynaklara artık ihtiyacınız yoksa, bunları silmek için bu adımları izleyin.

Azure Cloud Shell veya yerel Azure CLI kullanarak az group delete komutuyla bir kaynak grubundaki tüm Azure kaynaklarını silebilirsiniz . Kaynak grubunun kaldırılması şunları da kaldırır:

• Azure Digital Twins örneği (uçtan uca öğreticiden)
• IoT hub'ı ve hub cihaz kaydı (uçtan uca öğreticiden)
• Event Grid konusu ve ilişkili abonelikler
• Üç işlev ve depolama gibi ilişkili kaynaklar da dahil olmak üzere Azure İşlevleri uygulaması
• Azure SignalR örneği

Önemli

Silinen kaynak grupları geri alınamaz. Kaynak grubu ve içindeki tüm kaynaklar kalıcı olarak silinir. Yanlış kaynak grubunu veya kaynakları yanlışlıkla silmediğinizden emin olun.

az group delete --name <your-resource-group>

Son olarak, yerel makinenize indirdiğiniz proje örnek klasörlerini (digital-twins-samples-main.zip, digitaltwins-signalr-webapp-sample-main.zip ve sıkıştırması açılmış karşılıkları) silin.

Sonraki adımlar

Bu makalede, Azure Digital Twins telemetri olaylarını örnek bir istemci uygulamasına yayınlamak için SignalR ile Azure işlevlerini ayarlarsınız.

Ardından, Azure SignalR Hizmeti hakkında daha fazla bilgi edinin:

• Azure SignalR Hizmeti nedir?

veya Azure İşlevleri ile Azure SignalR Hizmeti Kimlik Doğrulaması hakkında daha fazla bilgi edinin:

• Azure SignalR Hizmeti kimlik doğrulaması