Samouczek: wprowadzenie do ASP.NET Core SignalRTutorial: Get started with ASP.NET Core SignalR

Ten samouczek uczy się podstaw tworzenia aplikacji w czasie rzeczywistym przy użyciu programu SignalR .This tutorial teaches the basics of building a real-time app using SignalR. Omawiane kwestie:You learn how to:

  • Utwórz projekt sieci Web.Create a web project.
  • Dodaj SignalR bibliotekę kliencką.Add the SignalR client library.
  • Utwórz SignalR centrum.Create a SignalR hub.
  • Skonfiguruj projekt do użycia SignalR .Configure the project to use SignalR.
  • Dodaj kod, który wysyła komunikaty z dowolnego klienta do wszystkich połączonych klientów.Add code that sends messages from any client to all connected clients.

Na końcu będziesz mieć działającą aplikację czatu:At the end, you'll have a working chat app:

::: No-Loc (Sygnalizującer)::: przykładowa aplikacja

Wymagania wstępnePrerequisites

Tworzenie projektu aplikacji internetowejCreate a web app project

  • Z menu wybierz pozycję plik > nowy projekt.From the menu, select File > New Project.

  • W oknie dialogowym Tworzenie nowego projektu wybierz pozycję ASP.NET Core aplikacja sieci Web, a następnie wybierz przycisk dalej.In the Create a new project dialog, select ASP.NET Core Web Application, and then select Next.

  • W oknie dialogowym Konfigurowanie nowego projektu Nazwij SignalR rozmowę projektu, a następnie wybierz pozycję Utwórz.In the Configure your new project dialog, name the project SignalRChat, and then select Create.

  • W oknie dialogowym Tworzenie nowej ASP.NET Core aplikacji sieci Web wybierz pozycję .net Core i ASP.NET Core 3,1.In the Create a new ASP.NET Core web Application dialog, select .NET Core and ASP.NET Core 3.1.

  • Wybierz pozycję aplikacja sieci Web , aby utworzyć projekt, który używa Razor stron, a następnie wybierz pozycję Utwórz.Select Web Application to create a project that uses Razor Pages, and then select Create.

    Okno dialogowe nowego projektu w programie Visual Studio

Dodawanie SignalR biblioteki klientaAdd the SignalR client library

SignalRBiblioteka serwerów jest dołączona do struktury udostępnionej ASP.NET Core 3,1.The SignalR server library is included in the ASP.NET Core 3.1 shared framework. Biblioteka klienta JavaScript nie jest automatycznie dołączana do projektu.The JavaScript client library isn't automatically included in the project. W tym samouczku użyjesz programu Library Manager (LibMan), aby uzyskać bibliotekę kliencką z unpkg.For this tutorial, you use Library Manager (LibMan) to get the client library from unpkg. unpkg to usługa Content Delivery Network (CDN), która umożliwia dostarczanie elementów znalezionych w npm, Menedżer pakietów Node.js.unpkg is a content delivery network (CDN) that can deliver anything found in npm, the Node.js package manager.

  • W Eksplorator rozwiązań kliknij prawym przyciskiem myszy projekt, a następnie wybierz polecenie Dodaj > bibliotekę po stronie klienta.In Solution Explorer, right-click the project, and select Add > Client-Side Library.

  • W oknie dialogowym Dodaj bibliotekę Client-Side , dla dostawcy wybierz pozycję unpkg.In the Add Client-Side Library dialog, for Provider select unpkg.

  • W obszarze Biblioteka wprowadź @microsoft/signalr@latest .For Library, enter @microsoft/signalr@latest.

  • Wybierz pozycję Wybierz określone pliki, rozwiń folder dist/przeglądarka , a następnie wybierz pozycję signalr.js i signalr.min.js.Select Choose specific files, expand the dist/browser folder, and select signalr.js and signalr.min.js.

  • Ustaw lokalizację docelową na plik wwwroot/js/signaler/, a następnie wybierz pozycję Zainstaluj.Set Target Location to wwwroot/js/signalr/, and select Install.

    Okno dialogowe Dodawanie biblioteki Client-Side — wybór biblioteki

    LibMan tworzy folder wwwroot/js/sygnalizujący i kopiuje do niego wybrane pliki.LibMan creates a wwwroot/js/signalr folder and copies the selected files to it.

Tworzenie SignalR centrumCreate a SignalR hub

Koncentrator jest klasą, która służy jako potok wysokiego poziomu, który obsługuje komunikację klient-serwer.A hub is a class that serves as a high-level pipeline that handles client-server communication.

  • W SignalR folderze projektu rozmowy utwórz folder Hubs .In the SignalRChat project folder, create a Hubs folder.

  • W folderze Hubs utwórz plik ChatHub.cs o następującym kodzie:In the Hubs folder, create a ChatHub.cs file with the following code:

    using Microsoft.AspNetCore.SignalR;
    using System.Threading.Tasks;
    
    namespace SignalRChat.Hubs
    {
        public class ChatHub : Hub
        {
            public async Task SendMessage(string user, string message)
            {
                await Clients.All.SendAsync("ReceiveMessage", user, message);
            }
        }
    }
    

    ChatHubKlasa dziedziczy z SignalR Hub klasy.The ChatHub class inherits from the SignalR Hub class. HubKlasa zarządza połączeniami, grupami i obsługą wiadomości.The Hub class manages connections, groups, and messaging.

    SendMessageMetoda może być wywoływana przez połączonego klienta w celu wysłania komunikatu do wszystkich klientów.The SendMessage method can be called by a connected client to send a message to all clients. Kod klienta JavaScript, który wywołuje metodę, jest wyświetlany w dalszej części samouczka.JavaScript client code that calls the method is shown later in the tutorial. SignalR kod jest asynchroniczny, aby zapewnić maksymalną skalowalność.SignalR code is asynchronous to provide maximum scalability.

Ponowne SignalRConfigure SignalR

SignalRSerwer musi być skonfigurowany tak, aby przekazywać SignalR żądania do SignalR .The SignalR server must be configured to pass SignalR requests to SignalR.

  • Dodaj następujący wyróżniony kod do pliku Startup.cs .Add the following highlighted code to the Startup.cs file.

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Threading.Tasks;
    using Microsoft.AspNetCore.Builder;
    using Microsoft.AspNetCore.Hosting;
    using Microsoft.AspNetCore.HttpsPolicy;
    using Microsoft.Extensions.Configuration;
    using Microsoft.Extensions.DependencyInjection;
    using Microsoft.Extensions.Hosting;
    using SignalRChat.Hubs;
    
    namespace SignalRChat
    {
        public class Startup
        {
            public Startup(IConfiguration configuration)
            {
                Configuration = configuration;
            }
    
            public IConfiguration Configuration { get; }
    
            // This method gets called by the runtime. Use this method to add services to the container.
            public void ConfigureServices(IServiceCollection services)
            {
                services.AddRazorPages();
                services.AddSignalR();
            }
    
            // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
            public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
            {
                if (env.IsDevelopment())
                {
                    app.UseDeveloperExceptionPage();
                }
                else
                {
                    app.UseExceptionHandler("/Error");
                    // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
                    app.UseHsts();
                }
    
                app.UseHttpsRedirection();
                app.UseStaticFiles();
    
                app.UseRouting();
    
                app.UseAuthorization();
    
                app.UseEndpoints(endpoints =>
                {
                    endpoints.MapRazorPages();
                    endpoints.MapHub<ChatHub>("/chathub");
                });
            }
        }
    }
    

    Te zmiany są dodawane SignalR do ASP.NET Core systemów iniekcji i routingu.These changes add SignalR to the ASP.NET Core dependency injection and routing systems.

Dodawanie SignalR kodu klientaAdd SignalR client code

  • Zastąp zawartość w Pages\Index.cshtml następującym kodem:Replace the content in Pages\Index.cshtml with the following code:

    @page
        <div class="container">
            <div class="row">&nbsp;</div>
            <div class="row">
                <div class="col-2">User</div>
                <div class="col-4"><input type="text" id="userInput" /></div>
            </div>
            <div class="row">
                <div class="col-2">Message</div>
                <div class="col-4"><input type="text" id="messageInput" /></div>
            </div>
            <div class="row">&nbsp;</div>
            <div class="row">
                <div class="col-6">
                    <input type="button" id="sendButton" value="Send Message" />
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-12">
                <hr />
            </div>
        </div>
        <div class="row">
            <div class="col-6">
                <ul id="messagesList"></ul>
            </div>
        </div>
    <script src="~/js/signalr/dist/browser/signalr.js"></script>
    <script src="~/js/chat.js"></script>
    

    Powyższy kod ma następujące działanie:The preceding code:

    • Tworzy pola tekstowe dla nazwy i tekstu komunikatu oraz przycisk Prześlij.Creates text boxes for name and message text, and a submit button.
    • Tworzy listę id="messagesList" na potrzeby wyświetlania komunikatów odbieranych z SignalR centrum.Creates a list with id="messagesList" for displaying messages that are received from the SignalR hub.
    • Zawiera odwołania do skryptu do SignalR i kod aplikacji chat.js utworzony w następnym kroku.Includes script references to SignalR and the chat.js application code that you create in the next step.
  • W folderze wwwroot/js utwórz plik chat.js przy użyciu następującego kodu:In the wwwroot/js folder, create a chat.js file with the following code:

    "use strict";
    
    var connection = new signalR.HubConnectionBuilder().withUrl("/chatHub").build();
    
    //Disable send button until connection is established
    document.getElementById("sendButton").disabled = true;
    
    connection.on("ReceiveMessage", function (user, message) {
        var msg = message.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
        var encodedMsg = user + " says " + msg;
        var li = document.createElement("li");
        li.textContent = encodedMsg;
        document.getElementById("messagesList").appendChild(li);
    });
    
    connection.start().then(function () {
        document.getElementById("sendButton").disabled = false;
    }).catch(function (err) {
        return console.error(err.toString());
    });
    
    document.getElementById("sendButton").addEventListener("click", function (event) {
        var user = document.getElementById("userInput").value;
        var message = document.getElementById("messageInput").value;
        connection.invoke("SendMessage", user, message).catch(function (err) {
            return console.error(err.toString());
        });
        event.preventDefault();
    });
    

    Powyższy kod ma następujące działanie:The preceding code:

    • Tworzy i uruchamia połączenie.Creates and starts a connection.
    • Dodaje do przycisku Prześlij procedurę obsługi, która wysyła komunikaty do centrum.Adds to the submit button a handler that sends messages to the hub.
    • Dodaje do obiektu Connection program obsługi, który odbiera komunikaty z centrum i dodaje je do listy.Adds to the connection object a handler that receives messages from the hub and adds them to the list.

Uruchamianie aplikacjiRun the app

  • Naciśnij klawisze CTRL + F5 , aby uruchomić aplikację bez debugowania.Press CTRL+F5 to run the app without debugging.
  • Skopiuj adres URL z paska adresu, Otwórz inne wystąpienie przeglądarki lub kartę, a następnie wklej adres URL na pasku adresu.Copy the URL from the address bar, open another browser instance or tab, and paste the URL in the address bar.

  • Wybierz opcję przeglądarka, wprowadź nazwę i komunikat, a następnie wybierz przycisk Wyślij wiadomość .Choose either browser, enter a name and message, and select the Send Message button.

    Nazwa i komunikat są natychmiast wyświetlane na obu stronach.The name and message are displayed on both pages instantly.

    ::: No-Loc (Sygnalizującer)::: przykładowa aplikacja

Porada

  • Jeśli aplikacja nie działa, Otwórz narzędzia deweloperskie przeglądarki (F12) i przejdź do konsoli programu.If the app doesn't work, open your browser developer tools (F12) and go to the console. Mogą pojawić się błędy związane z kodem HTML i JavaScript.You might see errors related to your HTML and JavaScript code. Załóżmy na przykład, że należy umieścić signalr.js w innym folderze niż skierowany.For example, suppose you put signalr.js in a different folder than directed. W takim przypadku odwołanie do tego pliku nie będzie działało i zobaczysz błąd 404 w konsoli.In that case the reference to that file won't work and you'll see a 404 error in the console.  Błąd nie znalezionosignalr.jssignalr.js not found error

  • Jeśli zostanie wyświetlony komunikat o błędzie ERR_SPDY_INADEQUATE_TRANSPORT_SECURITY w programie Chrome, uruchom następujące polecenia, aby zaktualizować certyfikat deweloperski:If you get the error ERR_SPDY_INADEQUATE_TRANSPORT_SECURITY in Chrome, run these commands to update your development certificate:

    dotnet dev-certs https --clean
    dotnet dev-certs https --trust
    

Ten samouczek uczy się podstaw tworzenia aplikacji w czasie rzeczywistym przy użyciu programu SignalR .This tutorial teaches the basics of building a real-time app using SignalR. Omawiane kwestie:You learn how to:

  • Utwórz projekt sieci Web.Create a web project.
  • Dodaj SignalR bibliotekę kliencką.Add the SignalR client library.
  • Utwórz SignalR centrum.Create a SignalR hub.
  • Skonfiguruj projekt do użycia SignalR .Configure the project to use SignalR.
  • Dodaj kod, który wysyła komunikaty z dowolnego klienta do wszystkich połączonych klientów.Add code that sends messages from any client to all connected clients.
    Na końcu będziesz mieć działającą aplikację czatu::::  no-Loc (signaler)::: przykładowa aplikacjaAt the end, you'll have a working chat app: SignalR sample app

Wymagania wstępnePrerequisites

Ostrzeżenie

Jeśli używasz programu Visual Studio 2017, zobacz dotnet/sdk problem #3124 informacje o wersjach .NET Core SDK, które nie działają z programem Visual Studio.If you use Visual Studio 2017, see dotnet/sdk issue #3124 for information about .NET Core SDK versions that don't work with Visual Studio.

Tworzenie projektu sieci WebCreate a web project

  • Z menu wybierz pozycję plik > nowy projekt.From the menu, select File > New Project.

  • W oknie dialogowym Nowy projekt wybierz pozycję zainstalowane > Visual C# > sieci Web > ASP.NET Core aplikacji sieci Web.In the New Project dialog, select Installed > Visual C# > Web > ASP.NET Core Web Application. Nadaj nazwę SignalR rozmowie projektu.Name the project SignalRChat.

    Okno dialogowe nowego projektu w programie Visual Studio

  • Wybierz pozycję aplikacja sieci Web , aby utworzyć projekt, który używa Razor stron.Select Web Application to create a project that uses Razor Pages.

  • Wybierz platformę docelową programu .NET Core, wybierz pozycję ASP.NET Core 2,2, a następnie kliknij przycisk OK.Select a target framework of .NET Core, select ASP.NET Core 2.2, and click OK.

    Okno dialogowe nowego projektu w programie Visual Studio

Dodawanie SignalR biblioteki klientaAdd the SignalR client library

SignalRBiblioteka serwerów jest dołączona do Microsoft.AspNetCore.App pakietu.The SignalR server library is included in the Microsoft.AspNetCore.App metapackage. Biblioteka klienta JavaScript nie jest automatycznie dołączana do projektu.The JavaScript client library isn't automatically included in the project. W tym samouczku użyjesz programu Library Manager (LibMan), aby uzyskać bibliotekę kliencką z unpkg.For this tutorial, you use Library Manager (LibMan) to get the client library from unpkg. unpkg to usługa Content Delivery Network (CDN), która umożliwia dostarczanie elementów znalezionych w npm, Menedżer pakietów Node.js.unpkg is a content delivery network (CDN) that can deliver anything found in npm, the Node.js package manager.

  • W Eksplorator rozwiązań kliknij prawym przyciskiem myszy projekt, a następnie wybierz polecenie Dodaj > bibliotekę po stronie klienta.In Solution Explorer, right-click the project, and select Add > Client-Side Library.

  • W oknie dialogowym Dodaj bibliotekę Client-Side , dla dostawcy wybierz pozycję unpkg.In the Add Client-Side Library dialog, for Provider select unpkg.

  • W polu Biblioteka wprowadź @microsoft/signalr@3 i wybierz najnowszą wersję, która nie jest w wersji zapoznawczej.For Library, enter @microsoft/signalr@3, and select the latest version that isn't preview.

    Okno dialogowe Dodawanie biblioteki Client-Side — wybór biblioteki

  • Wybierz pozycję Wybierz określone pliki, rozwiń folder dist/przeglądarka , a następnie wybierz pozycję signalr.js i signalr.min.js.Select Choose specific files, expand the dist/browser folder, and select signalr.js and signalr.min.js.

  • Ustaw lokalizację docelową na plik wwwroot/lib/sygnalizujący/, a następnie wybierz pozycję Zainstaluj.Set Target Location to wwwroot/lib/signalr/, and select Install.

    Okno dialogowe Dodawanie Client-Side biblioteki — Wybieranie plików i lokalizacji docelowej

    LibMan tworzy folder wwwroot/lib/sygnalizujący i kopiuje do niego wybrane pliki.LibMan creates a wwwroot/lib/signalr folder and copies the selected files to it.

Tworzenie SignalR centrumCreate a SignalR hub

Koncentrator jest klasą, która służy jako potok wysokiego poziomu, który obsługuje komunikację klient-serwer.A hub is a class that serves as a high-level pipeline that handles client-server communication.

  • W SignalR folderze projektu rozmowy utwórz folder Hubs .In the SignalRChat project folder, create a Hubs folder.

  • W folderze Hubs utwórz plik ChatHub.cs o następującym kodzie:In the Hubs folder, create a ChatHub.cs file with the following code:

    using Microsoft.AspNetCore.SignalR;
    using System.Threading.Tasks;
    
    namespace SignalRChat.Hubs
    {
        public class ChatHub : Hub
        {
            public async Task SendMessage(string user, string message)
            {
                await Clients.All.SendAsync("ReceiveMessage", user, message);
            }
        }
    }
    

    ChatHubKlasa dziedziczy z SignalR Hub klasy.The ChatHub class inherits from the SignalR Hub class. HubKlasa zarządza połączeniami, grupami i obsługą wiadomości.The Hub class manages connections, groups, and messaging.

    SendMessageMetoda może być wywoływana przez połączonego klienta w celu wysłania komunikatu do wszystkich klientów.The SendMessage method can be called by a connected client to send a message to all clients. Kod klienta JavaScript, który wywołuje metodę, jest wyświetlany w dalszej części samouczka.JavaScript client code that calls the method is shown later in the tutorial. SignalR kod jest asynchroniczny, aby zapewnić maksymalną skalowalność.SignalR code is asynchronous to provide maximum scalability.

Ponowne SignalRConfigure SignalR

SignalRSerwer musi być skonfigurowany tak, aby przekazywać SignalR żądania do SignalR .The SignalR server must be configured to pass SignalR requests to SignalR.

  • Dodaj następujący wyróżniony kod do pliku Startup.cs .Add the following highlighted code to the Startup.cs file.

    using Microsoft.AspNetCore.Builder;
    using Microsoft.AspNetCore.Hosting;
    using Microsoft.AspNetCore.Http;
    using Microsoft.AspNetCore.Mvc;
    using Microsoft.Extensions.Configuration;
    using Microsoft.Extensions.DependencyInjection;
    using SignalRChat.Hubs;
    
    namespace SignalRChat
    {
        public class Startup
        {
            public Startup(IConfiguration configuration)
            {
                Configuration = configuration;
            }
    
            public IConfiguration Configuration { get; }
    
            // This method gets called by the runtime. Use this method to add services to the container.
            public void ConfigureServices(IServiceCollection services)
            {
                services.Configure<CookiePolicyOptions>(options =>
                {
                    // This lambda determines whether user consent for non-essential cookies is needed for a given request.
                    options.CheckConsentNeeded = context => true;
                    options.MinimumSameSitePolicy = SameSiteMode.None;
                });
    
    
                services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_2_1);
    
                services.AddSignalR();
            }
    
            // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
            public void Configure(IApplicationBuilder app, IHostingEnvironment env)
            {
                if (env.IsDevelopment())
                {
                    app.UseDeveloperExceptionPage();
                }
                else
                {
                    app.UseExceptionHandler("/Error");
                    app.UseHsts();
                }
    
                app.UseHttpsRedirection();
                app.UseStaticFiles();
                app.UseCookiePolicy();
                app.UseSignalR(routes =>
                {
                    routes.MapHub<ChatHub>("/chathub");
                });
                app.UseMvc();
            }
        }
    }
    

    Te zmiany są dodawane SignalR do ASP.NET Core systemu iniekcji zależności oraz potoku oprogramowania pośredniczącego.These changes add SignalR to the ASP.NET Core dependency injection system and the middleware pipeline.

Dodawanie SignalR kodu klientaAdd SignalR client code

  • Zastąp zawartość w Pages\Index.cshtml następującym kodem:Replace the content in Pages\Index.cshtml with the following code:

    @page
    <div class="container">
        <div class="row">&nbsp;</div>
        <div class="row">
            <div class="col-6">&nbsp;</div>
            <div class="col-6">
                User..........<input type="text" id="userInput" />
                <br />
                Message...<input type="text" id="messageInput" />
                <input type="button" id="sendButton" value="Send Message" />
            </div>
        </div>
        <div class="row">
            <div class="col-12">
                <hr />
            </div>
        </div>
        <div class="row">
            <div class="col-6">&nbsp;</div>
            <div class="col-6">
                <ul id="messagesList"></ul>
            </div>
        </div>
    </div>
    <script src="~/lib/signalr/dist/browser/signalr.js"></script>
    <script src="~/js/chat.js"></script>
    

    Powyższy kod ma następujące działanie:The preceding code:

    • Tworzy pola tekstowe dla nazwy i tekstu komunikatu oraz przycisk Prześlij.Creates text boxes for name and message text, and a submit button.
    • Tworzy listę id="messagesList" na potrzeby wyświetlania komunikatów odbieranych z SignalR centrum.Creates a list with id="messagesList" for displaying messages that are received from the SignalR hub.
    • Zawiera odwołania do skryptu do SignalR i kod aplikacji chat.js utworzony w następnym kroku.Includes script references to SignalR and the chat.js application code that you create in the next step.
  • W folderze wwwroot/js utwórz plik chat.js przy użyciu następującego kodu:In the wwwroot/js folder, create a chat.js file with the following code:

    "use strict";
    
    var connection = new signalR.HubConnectionBuilder().withUrl("/chatHub").build();
    
    //Disable send button until connection is established
    document.getElementById("sendButton").disabled = true;
    
    connection.on("ReceiveMessage", function (user, message) {
        var msg = message.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
        var encodedMsg = user + " says " + msg;
        var li = document.createElement("li");
        li.textContent = encodedMsg;
        document.getElementById("messagesList").appendChild(li);
    });
    
    connection.start().then(function(){
        document.getElementById("sendButton").disabled = false;
    }).catch(function (err) {
        return console.error(err.toString());
    });
    
    document.getElementById("sendButton").addEventListener("click", function (event) {
        var user = document.getElementById("userInput").value;
        var message = document.getElementById("messageInput").value;
        connection.invoke("SendMessage", user, message).catch(function (err) {
            return console.error(err.toString());
        });
        event.preventDefault();
    });
    

    Powyższy kod ma następujące działanie:The preceding code:

    • Tworzy i uruchamia połączenie.Creates and starts a connection.
    • Dodaje do przycisku Prześlij procedurę obsługi, która wysyła komunikaty do centrum.Adds to the submit button a handler that sends messages to the hub.
    • Dodaje do obiektu Connection program obsługi, który odbiera komunikaty z centrum i dodaje je do listy.Adds to the connection object a handler that receives messages from the hub and adds them to the list.

Uruchamianie aplikacjiRun the app

  • Naciśnij klawisze CTRL + F5 , aby uruchomić aplikację bez debugowania.Press CTRL+F5 to run the app without debugging.
  • Skopiuj adres URL z paska adresu, Otwórz inne wystąpienie przeglądarki lub kartę, a następnie wklej adres URL na pasku adresu.Copy the URL from the address bar, open another browser instance or tab, and paste the URL in the address bar.

  • Wybierz opcję przeglądarka, wprowadź nazwę i komunikat, a następnie wybierz przycisk Wyślij wiadomość .Choose either browser, enter a name and message, and select the Send Message button.

    Nazwa i komunikat są natychmiast wyświetlane na obu stronach.The name and message are displayed on both pages instantly.

    ::: No-Loc (Sygnalizującer)::: przykładowa aplikacja

Porada

Jeśli aplikacja nie działa, Otwórz narzędzia deweloperskie przeglądarki (F12) i przejdź do konsoli programu.If the app doesn't work, open your browser developer tools (F12) and go to the console. Mogą pojawić się błędy związane z kodem HTML i JavaScript.You might see errors related to your HTML and JavaScript code. Załóżmy na przykład, że należy umieścić signalr.js w innym folderze niż skierowany.For example, suppose you put signalr.js in a different folder than directed. W takim przypadku odwołanie do tego pliku nie będzie działało i zobaczysz błąd 404 w konsoli.In that case the reference to that file won't work and you'll see a 404 error in the console.
 Błąd nie znalezionosignalr.jssignalr.js not found error

Dodatkowe zasobyAdditional resources