Praktické cvičení: Webové aplikace v reálném čase s knihovnou SignalR

Článek
07/13/2023

Upozornění

Tato dokumentace není určená pro nejnovější verzi SignalR. Podívejte se na ASP.NET Core SignalR.

Stáhnout Web Camps Training Kit, verze z října 2015

Webové aplikace v reálném čase mají možnost odesílat obsah na straně serveru připojeným klientům tak, jak se to děje, v reálném čase. Pro vývojáře ASP.NET je ASP.NET SignalR knihovna, která do svých aplikací přidává webové funkce v reálném čase. Využívá několik přenosů a automaticky vybírá nejlepší dostupný přenos s ohledem na nejlepší dostupný přenos klienta a serveru. Využívá WebSocket, rozhraní API HTML5, které umožňuje obousměrnou komunikaci mezi prohlížečem a serverem.

SignalR také poskytuje jednoduché rozhraní API vysoké úrovně pro provádění vzdáleného volání procedur (volání funkcí JavaScriptu v prohlížečích klientů z kódu .NET na straně serveru) ve vaší ASP.NET aplikaci a také přidání užitečných háků pro správu připojení, jako jsou události připojení/odpojení, seskupování připojení a autorizace.

SignalR je abstrakce některých přenosů, které jsou potřeba k práci mezi klientem a serverem v reálném čase. Připojení SignalR se spustí jako HTTP a pak se povyšuje na připojení WebSocket , pokud je k dispozici. Protokol WebSocket je ideální přenos pro SignalR, protože nejefektivněji využívá paměť serveru, má nejnižší latenci a má nejvíce základních funkcí (jako je úplná duplexní komunikace mezi klientem a serverem), ale má také ty nejnáročnější požadavky: WebSocket vyžaduje, aby server používal Windows Server 2012 nebo Windows 8. společně s rozhraním .NET Framework 4.5. Pokud tyto požadavky nejsou splněny, pokusí se SignalR použít k vytvoření připojení jiné přenosy (například dlouhé dotazování Ajax).

Rozhraní SIGNALR API obsahuje dva modely pro komunikaci mezi klienty a servery: trvalá připojení a centra. Připojení představuje jednoduchý koncový bod pro odesílání zpráv s jedním příjemcem, seskupených nebo vysílaných zpráv. Centrum je kanál vyšší úrovně založený na rozhraní API pro připojení, který umožňuje klientovi a serveru volat metody na sebe navzájem přímo.

Všechny ukázkové kódy a fragmenty kódu jsou součástí sady Web Camps Training Kit, verze z října 2015, která je k dispozici na adrese https://github.com/Microsoft-Web/WebCampTrainingKit/releases/tag/v2015.10.13b. Upozorňujeme, že odkaz instalačního programu na této stránce již nefunguje. použijte místo toho jeden z odkazů v části Prostředky.

Přehled

Cíle

V tomto praktickém cvičení se naučíte:

Odesílání oznámení ze serveru do klienta pomocí SignalR
Škálujte svou aplikaci SignalR na více instancí pomocí SQL Server.

Požadavky

K dokončení tohoto praktického cvičení se vyžaduje následující:

Visual Studio Express 2013 pro web nebo novější

Nastavení

Abyste mohli spustit cvičení v tomto praktickém cvičení, musíte nejprve nastavit prostředí.

Otevřete okno Průzkumníka Windows a přejděte do složky Zdroj testovacího prostředí.
Klikněte pravým tlačítkem na Setup.cmd a vyberte Spustit jako správce a spusťte proces instalace, který nakonfiguruje vaše prostředí a nainstaluje fragmenty kódu sady Visual Studio pro toto cvičení.
Pokud se zobrazí dialogové okno Řízení uživatelských účtů, potvrďte akci, která má pokračovat.

Poznámka

Před spuštěním instalace se ujistěte, že jste zkontrolovali všechny závislosti pro toto testovací prostředí.

Použití fragmentů kódu

V celém dokumentu testovacího prostředí budete vyzváni k vložení bloků kódu. Pro usnadnění přístupu je většina tohoto kódu k dispozici jako fragmenty kódu sady Visual Studio Code, ke kterým můžete přistupovat z Visual Studio 2013, abyste ho nemuseli přidávat ručně.

Poznámka

Každé cvičení je doprovázeno počátečním řešením umístěným ve složce Begin daného cvičení, které vám umožní sledovat každé cvičení nezávisle na ostatních cvičeních. Mějte na paměti, že fragmenty kódu přidané během cvičení v těchto počátečních řešeních chybí a nemusí fungovat, dokud cvičení nedokončíte. Ve zdrojovém kódu cvičení najdete také složku End obsahující řešení sady Visual Studio s kódem, který je výsledkem dokončení kroků v příslušném cvičení. Tato řešení můžete použít jako vodítko, pokud potřebujete další pomoc při práci v tomto praktickém cvičení.

Cvičení

Toto praktické cvičení zahrnuje následující cvičení:

Práce s Real-Time daty pomocí SignalR
Horizontální navýšení kapacity pomocí SQL Server

Odhadovaná doba dokončení tohoto cvičení: 60 minut

Poznámka

Při prvním spuštění sady Visual Studio musíte vybrat jednu z předdefinovaných kolekcí nastavení. Každá předdefinovaná kolekce je navržená tak, aby odpovídala konkrétnímu stylu vývoje a určuje rozložení oken, chování editoru, fragmenty kódu IntelliSense a možnosti dialogového okna. Postupy v tomto cvičení popisují akce potřebné k provedení daného úkolu v sadě Visual Studio při použití kolekce Obecné nastavení vývoje . Pokud pro vývojové prostředí zvolíte jinou kolekci nastavení, můžou existovat rozdíly v krocích, které byste měli vzít v úvahu.

Cvičení 1: Práce s Real-Time daty pomocí SignalR

Chat se často používá jako příklad, ale s webovými funkcemi v reálném čase toho zvládnete mnohem víc. Kdykoli uživatel aktualizuje webovou stránku, aby viděl nová data, nebo když stránka implementuje dlouhé dotazování Ajax za účelem načtení nových dat, můžete použít SignalR.

SignalR podporuje funkci serverového nabízení nebo vysílání ; zpracovává správu připojení automaticky. U klasických připojení HTTP pro komunikaci mezi klientem a serverem se připojení znovu naváže pro každý požadavek, ale SignalR poskytuje trvalé připojení mezi klientem a serverem. V SignalR volá kód serveru do klientského kódu v prohlížeči pomocí vzdáleného volání procedur (RPC) místo modelu žádosti a odpovědi, který dnes známe.

V tomto cvičení nakonfigurujete aplikaci Geek Quiz tak, aby pomocí SignalR zobrazila řídicí panel Statistika s aktualizovanými metrikami, aniž by bylo nutné aktualizovat celou stránku.

Úkol 1 – prozkoumání stránky statistiky kvízu Geek

V tomto úkolu projdete aplikaci a ověříte, jak se zobrazí stránka statistiky a jak můžete zlepšit způsob aktualizace informací.

Otevřete Visual Studio Express 2013 for Web a otevřete řešení GeekQuiz.sln umístěné ve složce Source\Ex1-WorkingWithRealTimeData\Begin.
Stisknutím klávesy F5 spusťte řešení. V prohlížeči by se měla zobrazit stránka Přihlášení .

Spuštění řešení
Kliknutím na Zaregistrovat v pravém horním rohu stránky vytvořte v aplikaci nového uživatele.

Odkaz zaregistrovat
Na stránce Register (Zaregistrovat) zadejte Uživatelské jméno a Heslo a klikněte na Register (Zaregistrovat).

Registrace uživatele
Aplikace zaregistruje nový účet a uživatel se ověří a přesměruje zpět na domovskou stránku s první otázkou kvízu.
Otevřete stránku Statistika v novém okně a umístěte domovskou stránku a stránku Statistiky vedle sebe.

vedle

Okna vedle sebe
Na domovské stránce odpovězte na otázku kliknutím na jednu z možností.

Odpověď na otázku
Po kliknutí na jedno z tlačítek by se měla zobrazit odpověď.

Správná odpověď na otázku
Všimněte si, že informace uvedené na stránce Statistika jsou zastaralé. Aktualizujte stránku, aby se zobrazily aktualizované výsledky.

Stránka Statistika
Zpět do sady Visual Studio a zastavte ladění.

Úkol 2 – Přidání SignalR do kvízu Geek pro zobrazení online grafů

V této úloze přidáte do řešení SignalR a automaticky odešlete aktualizace klientům při odeslání nové odpovědi na server.

V nabídce Nástroje v sadě Visual Studio vyberte Správce balíčků NuGet a pak klikněte na Konzola Správce balíčků.
V okně konzoly Správce balíčků spusťte následující příkaz:
```
Install-Package Microsoft.AspNet.SignalR
```
Instalace balíčku SignalR
Poznámka

Při instalaci balíčků SignalR NuGet verze 2.0.2 ze zcela nové aplikace MVC 5 budete muset balíčky OWIN ručně aktualizovat na verzi 2.0.1 (nebo vyšší) před instalací signalr. Uděláte to tak, že v konzole Správce balíčků spustíte následující skript:
```
get-package | where-object { $_.Id -like "Microsoft.Owin*"} | Update-Package
```
V budoucí verzi SignalR se závislosti OWIN automaticky aktualizují.
V Průzkumník řešení rozbalte složku Scripts (Skripty) a všimněte si, že se do řešení přidaly soubory Js SignalR.

Odkazy na JavaScript pro SignalR
V Průzkumník řešení klikněte pravým tlačítkem na projekt GeekQuiz, vyberte Přidat | novou složku a pojmenujte ho Hubs.
Klikněte pravým tlačítkem na složku Hubs a vyberte Přidat | Nová položka.

Přidat novou položku
V dialogovém okně Přidat novou položku vyberte Visual C# | Web | V levém podokně uzlu SignalR vyberte SignalR Hub Class (v2) v prostředním podokně, pojmenujte soubor StatisticsHub.cs a klikněte na Přidat.

Dialogové okno Přidat novou položku
Nahraďte kód ve třídě StatisticsHub následujícím kódem.

(Fragment kódu – RealTimeSignalR – Ex1 – StatisticsHubClass)
```
namespace GeekQuiz.Hubs
{
    using Microsoft.AspNet.SignalR;

    public class StatisticsHub : Hub
    {
    }
}
```
Otevřete Soubor Startup.cs a na konec metody Configuration přidejte následující řádek.

(Fragment kódu – RealTimeSignalR – Ex1 – MapSignalR)
```
public void Configuration(IAppBuilder app)
{
    this.ConfigureAuth(app);
    app.MapSignalR();
}
```
Otevřete stránku StatisticsService.cs ve složce Services a přidejte následující direktivy using.

(Fragment kódu – RealTimeSignalR – Ex1 – UsingDirectives)
```
using Microsoft.AspNet.SignalR;
using GeekQuiz.Hubs;
```
Chcete-li upozorňovat připojené klienty na aktualizace, nejprve načtěte objekt Context pro aktuální připojení. Objekt Hub obsahuje metody pro odesílání zpráv do jednoho klienta nebo všesměrové vysílání všem připojeným klientům. Přidejte následující metodu do třídy StatisticsService pro vysílání dat statistiky.

(Fragment kódu – RealTimeSignalR – Ex1 – NotifyUpdatesMethod)
```
public async Task NotifyUpdates()
{
    var hubContext = GlobalHost.ConnectionManager.GetHubContext<StatisticsHub>();
    if (hubContext != null)
    {
         var stats = await this.GenerateStatistics();
         hubContext.Clients.All.updateStatistics(stats);
    }
}
```
Poznámka

Ve výše uvedeném kódu používáte libovolný název metody k volání funkce v klientovi (tj. updateStatistics). Zadaný název metody je interpretován jako dynamický objekt, což znamená, že pro něj neexistuje technologie IntelliSense ani ověření v době kompilace. Výraz se vyhodnocuje za běhu. Když se volání metody spustí, SignalR odešle název metody a hodnoty parametrů klientovi. Pokud má klient metodu, která odpovídá názvu, volá se tato metoda a předávají se jí hodnoty parametrů. Pokud se v klientovi nenajde žádná odpovídající metoda, nevyvolá se žádná chyba. Další informace najdete v průvodci ASP.NET rozhraním API služby SignalR Hubs.
Otevřete stránku TriviaController.cs ve složce Controllers a přidejte následující direktivy using.
```
using GeekQuiz.Services;
```

Do metody akce Post přidejte následující zvýrazněný kód.

(Fragment kódu – RealTimeSignalR – Ex1 – NotifyUpdatesCall)

public async Task<IHttpActionResult> Post(TriviaAnswer answer)
{
    if (!ModelState.IsValid)
    {
         return this.BadRequest(this.ModelState);
    }

    answer.UserId = User.Identity.Name;

    var isCorrect = await this.StoreAsync(answer);

    var statisticsService = new StatisticsService(this.db);
    await statisticsService.NotifyUpdates();

    return this.Ok<bool>(isCorrect);
}

Otevřete stránku Statistics.cshtml uvnitř zobrazení | Domovská složka. Vyhledejte oddíl Skripty a na začátek oddílu přidejte následující odkazy na skripty.

(Fragment kódu – RealTimeSignalR – Ex1 – SignalRScriptReferences)
```
@section Scripts {
    @Scripts.Render("~/Scripts/jquery.signalR-2.0.2.min.js");
    @Scripts.Render("~/signalr/hubs");
    ...
}
```
Poznámka

Když do projektu sady Visual Studio přidáte knihovnu SignalR a další knihovny skriptů, správce balíčků může nainstalovat verzi souboru skriptu SignalR, která je novější než verze uvedená v tomto tématu. Ujistěte se, že odkaz na skript v kódu odpovídá verzi knihovny skriptů nainstalované v projektu.

Přidejte následující zvýrazněný kód pro připojení klienta k centru SignalR a aktualizaci dat statistiky při přijetí nové zprávy z centra.

(Fragment kódu – RealTimeSignalR – Ex1 – SignalRClientCode)

@section Scripts {
    ...
    <script>
        ...

        var connection = $.hubConnection();
        var hub = connection.createHubProxy("StatisticsHub");
        hub.on("updateStatistics", function (statistics) {
                statisticsData = statistics;
                $("#correctAnswersCounter").text(statistics.CorrectAnswers);
                $("#incorrectAnswersCounter").text(statistics.IncorrectAnswers);

                showCharts(statisticsData);
          });

        connection.start();
    </script>
}

V tomto kódu vytváříte proxy centra a zaregistrujete obslužnou rutinu události, která naslouchá zprávům odeslaným serverem. V tomto případě nasloucháte zprávám odeslaných prostřednictvím metody updateStatistics .

Úloha 3 – spuštění řešení

V této úloze spustíte řešení, které ověří, že se zobrazení statistik automaticky aktualizuje pomocí SignalR po zodpovězení nové otázky.

Stisknutím klávesy F5 spusťte řešení.

Poznámka

Pokud ještě nejste přihlášeni k aplikaci, přihlaste se pomocí uživatele, který jste vytvořili v úloze 1.
Otevřete stránku Statistika v novém okně a vložte domovskou stránku a stránku Statistika vedle sebe, jak jste to udělali v úkolu 1.
Na domovské stránce odpovězte na otázku kliknutím na jednu z možností.

Odpověď na další otázku
Po kliknutí na jedno z tlačítek by se měla zobrazit odpověď. Všimněte si, že informace o statistikách na stránce se aktualizují automaticky po zodpovězení otázky aktualizovanými informacemi, aniž by bylo nutné aktualizovat celou stránku.

Stránka Statistika se aktualizovala po odpovědi.

Cvičení 2: Horizontální navýšení kapacity pomocí SQL Server

Při škálování webové aplikace si obecně můžete vybrat mezi možnostmi vertikálního navýšení a horizontálního navýšení kapacity . Vertikální navýšení kapacity znamená použití většího serveru s více prostředky (procesor, paměť RAM atd.), zatímco horizontální navýšení kapacity znamená přidání dalších serverů pro zpracování zatížení. Problém s druhým problémem je v tom, že klienti mohou být směrovány na různé servery. Klient připojený k jednomu serveru nebude přijímat zprávy odeslané z jiného serveru.

Tyto problémy můžete vyřešit pomocí komponenty s názvem backplane pro předávání zpráv mezi servery. Když je povolené backplane, každá instance aplikace odesílá zprávy do backplane a backplane je předá ostatním instancím aplikace.

V současné době existují tři typy backplanes pro SignalR:

Windows Azure Service Bus. Service Bus je infrastruktura zasílání zpráv, která umožňuje komponentám odesílat volně propojené zprávy.
SQL Server. Backplane SQL Server zapisuje zprávy do tabulek SQL. Backplane používá Service Broker pro efektivní zasílání zpráv. Funguje ale také v případě, že není povolená služba Service Broker.
Redis. Redis je úložiště klíč-hodnota v paměti. Redis podporuje model publikování/odběru (pub/sub) pro odesílání zpráv.

Každá zpráva se odešle prostřednictvím sběrnice zpráv. Sběrnice zpráv implementuje rozhraní IMessageBus , které poskytuje abstrakci publikování/odběru. Backplanes fungují tak, že nahradí výchozí IMessageBus sběrnici určenou pro toto backplane.

Každá instance serveru se připojí k backplane prostřednictvím sběrnice. Když je zpráva odeslána, přejde do backplane a backplane ji odešle na každý server. Když server přijme zprávu z backplane, uloží zprávu do místní mezipaměti. Server pak doručuje zprávy klientům z místní mezipaměti.

Další informace o tom, jak funguje záložní rovina SignalR, najdete v tomto článku.

Poznámka

Existují některé scénáře, kdy se backplane může stát kritickým bodem. Tady jsou některé typické scénáře služby SignalR:

Vysílání serveru (například burzovní ticker): Pro tento scénář dobře fungují backplanes, protože server řídí rychlost, s jakou se zprávy odesílají.
Klient-klient (např. chat): V tomto scénáři může být backplane kritickým bodem, pokud se počet zpráv škáluje s počtem klientů; to znamená, že pokud rychlost zpráv roste proporcionálně s tím, jak se připojuje více klientů.
Vysokofrekvenční realtime (např. hry v reálném čase): Pro tento scénář se nedoporučuje backplane.

V tomto cvičení použijete SQL Server k distribuci zpráv v aplikaci Geek Quiz. Tyto úlohy spustíte na jednom testovacím počítači, abyste zjistili, jak nastavit konfiguraci, ale abyste získali úplný efekt, budete muset aplikaci SignalR nasadit na dva nebo více serverů. Musíte také nainstalovat SQL Server na jeden ze serverů nebo na samostatný vyhrazený server.

Horizontální navýšení kapacity pomocí diagramu SQL Server

Úkol 1 – vysvětlení scénáře

V této úloze spustíte 2 instance Geek Quiz simulující více instancí služby IIS na místním počítači. V tomto scénáři se při odpovídání na otázky týkající se jedné aplikace neoznámí aktualizace na stránce statistik druhé instance. Tato simulace se podobá prostředí, ve kterém je vaše aplikace nasazená na více instancích a ke komunikaci s nimi používá nástroj pro vyrovnávání zatížení.

Otevřete řešení Begin.sln umístěné ve složce Source/Ex2-ScalingOutWithSQLServer/Begin . Po načtení si v Průzkumníku serveru všimnete, že řešení má dva projekty se identickou strukturou, ale s různými názvy. To bude simulovat spuštění dvou instancí stejné aplikace na místním počítači.

Zahájení řešení simulující 2 instance kvízu Geek
Otevřete stránku vlastností řešení tak, že kliknete pravým tlačítkem na uzel řešení a vyberete Vlastnosti. V části Spouštěný projekt vyberte Více projektů po spuštění a změňte hodnotu Akce pro oba projekty na Spustit.

Spouštění více projektů
Stisknutím klávesy F5 spusťte řešení. Aplikace spustí dvě instance geek kvízu na různých portech a simuluje více instancí stejné aplikace. Připněte jeden z prohlížečů nalevo a druhý na pravé straně obrazovky. Přihlaste se pomocí svých přihlašovacích údajů nebo zaregistrujte nového uživatele. Po přihlášení ponechte na levé straně stránku Trivia a v prohlížeči vpravo přejděte na stránku Statistika .

Geek Kvíz vedle sebe

Kvíz geek na různých portech
Začněte odpovídat na otázky v levém prohlížeči a všimněte si, že se neaktualizuje stránka Statistika v pravém prohlížeči. Důvodem je to, že SignalR používá místní mezipaměť k distribuci zpráv mezi klienty a tento scénář simuluje více instancí, a proto mezi nimi není mezipaměť sdílena. To, že SignalR funguje, můžete ověřit testováním stejných kroků, ale pomocí jedné aplikace. V následujících úlohách nakonfigurujete backplane pro replikaci zpráv napříč instancemi.
Zpět do sady Visual Studio a zastavte ladění.

Úkol 2 – vytvoření SQL Server backplane

V tomto úkolu vytvoříte databázi, která bude sloužit jako backplane pro aplikaci Geek Quiz . K procházení serveru a inicializaci databáze použijete SQL Server Průzkumník objektů. Kromě toho povolíte službu Service Broker.

V sadě Visual Studio otevřete nabídku Zobrazení a vyberte SQL Server Průzkumník objektů.
Připojte se k instanci LocalDB kliknutím pravým tlačítkem myši na uzel SQL Server a výběrem možnosti Přidat SQL Server...

Přidání instance SQL Server do SQL Server Průzkumník objektů
Nastavte název serveru na (localdb)\v11.0 a jako režim ověřování ponechte Ověřování systému Windows . Pokračujte kliknutím na Připojit.

Připojení k LocalDB
Teď, když jste připojení k instanci LocalDB, budete muset vytvořit databázi, která bude představovat SQL Server backplane pro SignalR. Uděláte to tak, že kliknete pravým tlačítkem na uzel Databáze a vyberete Přidat novou databázi.

Přidání nové databáze
Nastavte název databáze na SignalR a kliknutím na OK ji vytvořte.

Vytvoření databáze SignalR

Poznámka

Můžete zvolit libovolný název databáze.
Pro efektivnější příjem aktualizací z backplane doporučujeme pro databázi povolit Service Broker. Service Broker poskytuje nativní podporu pro zasílání zpráv a řazení do front v SQL Server. Backplane funguje i bez Service Brokeru. Otevřete nový dotaz tak, že kliknete pravým tlačítkem na databázi a vyberete Nový dotaz.

Otevření nového dotazu
Pokud chcete zkontrolovat, jestli je služba Service Broker povolená, zadejte dotaz na sloupec is_broker_enabled v zobrazení katalogu sys.databases . V nedávno otevřeném okně dotazu spusťte následující skript.
```
SELECT [name], [service_broker_guid], [is_broker_enabled] FROM [master].[sys].[databases]
```
Dotazování stavu služby Service Broker
Pokud je hodnota sloupce is_broker_enabled ve vaší databázi "0", povolte ji následujícím příkazem. Nahraďte <YOUR-DATABASE> názvem, který jste nastavili při vytváření databáze (např.: SignalR).
```
ALTER DATABASE <YOUR-DATABASE> SET ENABLE_BROKER
```
Povolení služby Service Broker

Poznámka

Pokud se zdá, že se tento dotaz zablokuje, ujistěte se, že k databázi nejsou připojené žádné aplikace.

Úloha 3 – konfigurace aplikace SignalR

V tomto úkolu nakonfigurujete geek quiz pro připojení k SQL Server backplane. Nejprve přidáte balíček NuGet SignalR.SqlServer a nastavíte připojovací řetězec do databáze backplane.

Otevřete konzolu Správce balíčků v nástrojích>Správce balíčků NuGet. Ujistěte se, že je v rozevíracím seznamu Výchozí projekt vybraný projekt GeekQuiz. Zadáním následujícího příkazu nainstalujte balíček NuGet Microsoft.AspNet.SignalR.SqlServer .
```
Install-Package Microsoft.AspNet.SignalR.SqlServer
```
Opakujte předchozí krok, ale tentokrát pro projekt GeekQuiz2.
Chcete-li nakonfigurovat SQL Server backplane, otevřete soubor Startup.cs projektu GeekQuiz a přidejte do metody Configure následující kód. Nahraďte <YOUR-DATABASE> názvem databáze, který jste použili při vytváření SQL Server backplane. Opakujte tento krok pro projekt GeekQuiz2 .

(Fragment kódu – RealTimeSignalR – Ex2 – StartupConfiguration)
```
public class Startup 
{   
    public void Configuration(IAppBuilder app) 
    {           
        var sqlConnectionString = @"Server=(localdb)\v11.0;Database=<YOUR-DATABASE>;Integrated Security=True;";
        GlobalHost.DependencyResolver.UseSqlServer(sqlConnectionString); 
        this.ConfigureAuth(app);
        app.MapSignalR();
    }
}
```
Teď, když jsou oba projekty nakonfigurované tak, aby používaly SQL Server backplane, stiskněte klávesu F5 a spusťte je současně.
Visual Studio znovu spustí dvě instance kvízu Geek na různých portech. Připněte jeden z prohlížečů nalevo a druhý na pravé straně obrazovky a přihlaste se pomocí svých přihlašovacích údajů. Ponechte stránku Trivia vlevo a přejděte na stránku Statistika v pravém prohlížeči.
Začněte odpovídat na otázky v levém prohlížeči. Tentokrát se stránka Statistika aktualizuje díky backplane. Přepněte mezi aplikacemi (Statistika je teď vlevo a Trivia je vpravo) a opakujte test, abyste ověřili, že funguje pro obě instance. Backplane slouží jako sdílená mezipaměť zpráv pro každý připojený server a každý server bude ukládat zprávy do své vlastní místní mezipaměti, aby je mohli distribuovat připojeným klientům.
Zpět do sady Visual Studio a zastavte ladění.
Komponenta backplane SQL Server automaticky vygeneruje potřebné tabulky v zadané databázi. Na panelu SQL Server Průzkumník objektů otevřete databázi, kterou jste vytvořili pro backplane (např.: SignalR), a rozbalte její tabulky. Měli byste vidět následující tabulky:

Backplane Generated Tables
Klikněte pravým tlačítkem na tabulku SignalR.Messages_0 a vyberte Zobrazit data.

Zobrazit tabulku zpráv v backplane SignalR
Při odpovídání na otázky o trivii se můžete podívat na různé zprávy odeslané do centra . Backplane distribuuje tyto zprávy do jakékoli připojené instance.

Backplane Messages Table

Souhrn

V tomto praktickém cvičení jste zjistili, jak přidat SignalR do aplikace a odesílat oznámení ze serveru připojeným klientům pomocí Hubs. Dále jste se dozvěděli, jak škálovat aplikaci pomocí komponenty backplane , když je aplikace nasazená ve více instancích služby IIS.

Sdílet prostřednictvím

Praktické cvičení: Webové aplikace v reálném čase s knihovnou SignalR

Přehled

Cíle

Požadavky

Nastavení

Použití fragmentů kódu

Cvičení

Cvičení 1: Práce s Real-Time daty pomocí SignalR

Úkol 1 – prozkoumání stránky statistiky kvízu Geek

Úkol 2 – Přidání SignalR do kvízu Geek pro zobrazení online grafů

Úloha 3 – spuštění řešení

Cvičení 2: Horizontální navýšení kapacity pomocí SQL Server

Úkol 1 – vysvětlení scénáře

Úkol 2 – vytvoření SQL Server backplane

Úloha 3 – konfigurace aplikace SignalR

Souhrn

Váš názor

Další materiály