Share via


Esercitazione: Self-hosting di SignalR

di Patrick Fletcher

Avviso

Questa documentazione non è per la versione più recente di SignalR. Esaminare ASP.NET Core SignalR.

Questa esercitazione illustra come creare un server SignalR 2 self-hosted e come connettersi con un client JavaScript.

Versioni software usate nell'esercitazione

Uso di Visual Studio 2012 con questa esercitazione

Per usare Visual Studio 2012 con questa esercitazione, eseguire le operazioni seguenti:

  • Aggiornare Gestione pacchetti alla versione più recente.
  • Installare il programma di installazione della piattaforma Web.
  • Nel programma di installazione della piattaforma Web cercare e installare ASP.NET and Web Tools 2013.1 per Visual Studio 2012. In questo modo verranno installati modelli di Visual Studio per classi SignalR, ad esempio Hub.
  • Alcuni modelli (ad esempio la classe di avvio OWIN) non saranno disponibili; per questi, usare invece un file di classe.

Domande e commenti

Lasciare commenti e suggerimenti su come è piaciuta questa esercitazione e ciò che è possibile migliorare nei commenti nella parte inferiore della pagina. Se si hanno domande che non sono direttamente correlate all'esercitazione, è possibile pubblicarli nel forum ASP.NET SignalR o StackOverflow.com.

Panoramica

Un server SignalR è in genere ospitato in un'applicazione ASP.NET in IIS, ma può anche essere self-hosted (ad esempio in un'applicazione console o in un servizio Windows) usando la libreria self-host. Questa libreria, come tutti i SignalR 2, è basata su OWIN (Open Web Interface for .NET). OWIN definisce un'astrazione tra i server Web .NET e le applicazioni Web. OWIN separa l'applicazione Web dal server, che rende OWIN ideale per l'auto-hosting di un'applicazione Web nel proprio processo, all'esterno di IIS.

I motivi per non ospitare in IIS includono:

  • Ambienti in cui IIS non è disponibile o desiderabile, ad esempio una server farm esistente senza IIS.
  • Il sovraccarico delle prestazioni di IIS deve essere evitato.
  • La funzionalità SignalR deve essere aggiunta a un'applicazione esistente eseguita in un servizio Windows, nel ruolo di lavoro di Azure o in un altro processo.

Se una soluzione viene sviluppata come self-host per motivi di prestazioni, è consigliabile testare anche l'applicazione ospitata in IIS per determinare il vantaggio delle prestazioni.

Questa esercitazione contiene le sezioni seguenti:

Creazione del server

In questa esercitazione si creerà un server ospitato in un'applicazione console, ma il server può essere ospitato in qualsiasi tipo di processo, ad esempio un servizio Windows o un ruolo di lavoro di Azure. Per codice di esempio per l'hosting di un server SignalR in un servizio Windows, vedere Self-Hosting SignalR in un servizio Windows.

  1. Aprire Visual Studio 2013 con privilegi di amministratore. Selezionare File, Nuovo progetto. Selezionare Windows nel nodo Visual C# nel riquadro Modelli e selezionare il modello di applicazione console . Assegnare un nome al nuovo progetto "SignalRSelfHost" e fare clic su OK.

    Screenshot della schermata Nuovo progetto con l'opzione Windows, il modello applicazione console e il campo Nome evidenziato.

  2. Aprire la console di Gestione pacchetti NuGet selezionando Strumenti>Console di Gestione pacchettiNuGet>.

  3. Nella console di Gestione pacchetti immettere il comando seguente:

    Install-Package Microsoft.AspNet.SignalR.SelfHost
    

    Questo comando aggiunge le librerie di Self-Host SignalR 2 al progetto.

  4. Nella console di Gestione pacchetti immettere il comando seguente:

    Install-Package Microsoft.Owin.Cors
    

    Questo comando aggiunge la libreria Microsoft.Owin.Cors al progetto. Questa libreria verrà usata per il supporto tra domini, che è necessario per le applicazioni che ospitano SignalR e un client di pagina Web in domini diversi. Poiché si ospita il server SignalR e il client Web in porte diverse, ciò significa che per la comunicazione tra questi componenti è necessario abilitare cross-domain.

  5. Sostituire il contenuto del file Program.cs con il codice seguente.

    using System;
    using Microsoft.AspNet.SignalR;
    using Microsoft.Owin.Hosting;
    using Owin;
    using Microsoft.Owin.Cors;
    
    namespace SignalRSelfHost
    {
        class Program
        {
            static void Main(string[] args)
            {
                // This will *ONLY* bind to localhost, if you want to bind to all addresses
                // use http://*:8080 to bind to all addresses. 
                // See http://msdn.microsoft.com/library/system.net.httplistener.aspx 
                // for more information.
                string url = "http://localhost:8080";
                using (WebApp.Start(url))
                {
                    Console.WriteLine("Server running on {0}", url);
                    Console.ReadLine();
                }
            }
        }
        class Startup
        {
            public void Configuration(IAppBuilder app)
            {
                app.UseCors(CorsOptions.AllowAll);
                app.MapSignalR();
            }
        }
        public class MyHub : Hub
        {
            public void Send(string name, string message)
            {
                Clients.All.addMessage(name, message);
            }
        }
    }
    

    Il codice precedente include tre classi:

    • Programma, incluso il metodo Main che definisce il percorso primario di esecuzione. In questo metodo viene avviata un'applicazione Web di tipo Startup all'URL specificato (http://localhost:8080). Se è necessaria la sicurezza nell'endpoint, è possibile implementare SSL. Per altre informazioni , vedere Procedura: Configurare una porta con un certificato SSL .
    • Avvio, la classe contenente la configurazione per il server SignalR (l'unica configurazione usata da questa esercitazione è la chiamata a ) e la chiamata a UseCorsMapSignalR, che crea route per tutti gli oggetti hub nel progetto.
    • MyHub, la classe Hub SignalR che l'applicazione fornirà ai client. Questa classe include un singolo metodo, Send, che i client chiameranno per trasmettere un messaggio a tutti gli altri client connessi.
  6. Compilare l'applicazione ed eseguirla. L'indirizzo in esecuzione del server deve essere visualizzato in una finestra della console.

    Screenshot del server in esecuzione in una finestra della console.

  7. Se l'esecuzione ha esito negativo con l'eccezione System.Reflection.TargetInvocationException was unhandled, sarà necessario riavviare Visual Studio con privilegi di amministratore.

  8. Arrestare l'applicazione prima di procedere alla sezione successiva.

Accesso al server con un client JavaScript

In questa sezione si userà lo stesso client JavaScript dall'esercitazione di Introduzione. Verrà apportata una sola modifica al client, che consiste nel definire in modo esplicito l'URL dell'hub. Con un'applicazione self-hosted, il server potrebbe non essere necessariamente allo stesso indirizzo dell'URL di connessione (a causa di proxy inverso e bilanciamento del carico), pertanto l'URL deve essere definito in modo esplicito.

  1. In Esplora soluzioni fare clic con il pulsante destro del mouse sulla soluzione e scegliere Aggiunginuovo progetto. Selezionare il nodo Web e selezionare il modello di applicazione Web ASP.NET . Assegnare un nome al progetto "JavascriptClient" e fare clic su OK.

    Screenshot della schermata Aggiungi nuovo progetto con il nodo Web, il modello applicazione Web punto S P e il campo Nome evidenziati.

  2. Selezionare il modello Vuoto e lasciare deselezionate le opzioni rimanenti. Selezionare Crea progetto.

    Screenshot della schermata New A P dot NET Project con il modello Vuoto selezionato e l'opzione Crea progetto evidenziata.

  3. Nella console di Gestione pacchetti selezionare il progetto "JavascriptClient" nell'elenco a discesa Progetto predefinito ed eseguire il comando seguente:

    Install-Package Microsoft.AspNet.SignalR.JS
    

    Questo comando installa le librerie SignalR e JQuery necessarie nel client.

  4. Fare clic con il pulsante destro del mouse sul progetto e scegliere Aggiungi, Nuovo elemento. Selezionare il nodo Web e selezionare Pagina HTML. Assegnare un nome alla pagina Default.html.

    Screenshot della schermata Aggiungi nuovo elemento con l'opzione Web, il modello di pagina H T M L e il campo Nome evidenziati.

  5. Sostituire il contenuto della nuova pagina HTML con il codice seguente. Verificare che i riferimenti allo script corrispondano agli script nella cartella Script del progetto.

    <!DOCTYPE html>
    <html>
    <head>
        <title>SignalR Simple Chat</title>
        <style type="text/css">
            .container {
                background-color: #99CCFF;
                border: thick solid #808080;
                padding: 20px;
                margin: 20px;
            }
        </style>
    </head>
    <body>
        <div class="container">
            <input type="text" id="message" />
            <input type="button" id="sendmessage" value="Send" />
            <input type="hidden" id="displayname" />
            <ul id="discussion"></ul>
        </div>
        <!--Script references. -->
        <!--Reference the jQuery library. -->
        <script src="Scripts/jquery-1.6.4.min.js"></script>
        <!--Reference the SignalR library. -->
        <script src="Scripts/jquery.signalR-2.1.0.min.js"></script>
        <!--Reference the autogenerated SignalR hub script. -->
        <script src="http://localhost:8080/signalr/hubs"></script>
        <!--Add script to update the page and send messages.-->
        <script type="text/javascript">
            $(function () {
            //Set the hubs URL for the connection
                $.connection.hub.url = "http://localhost:8080/signalr";
                
                // Declare a proxy to reference the hub.
                var chat = $.connection.myHub;
                
                // Create a function that the hub can call to broadcast messages.
                chat.client.addMessage = function (name, message) {
                    // Html encode display name and message.
                    var encodedName = $('<div />').text(name).html();
                    var encodedMsg = $('<div />').text(message).html();
                    // Add the message to the page.
                    $('#discussion').append('<li><strong>' + encodedName
                        + '</strong>:&nbsp;&nbsp;' + encodedMsg + '</li>');
                };
                // Get the user name and store it to prepend to messages.
                $('#displayname').val(prompt('Enter your name:', ''));
                // Set initial focus to message input box.
                $('#message').focus();
                // Start the connection.
                $.connection.hub.start().done(function () {
                    $('#sendmessage').click(function () {
                        // Call the Send method on the hub.
                        chat.server.send($('#displayname').val(), $('#message').val());
                        // Clear text box and reset focus for next comment.
                        $('#message').val('').focus();
                    });
                });
            });
        </script>
    </body>
    </html>
    

    Il codice seguente (evidenziato nell'esempio di codice precedente) è l'aggiunta apportata al client usato nell'esercitazione Getting Stared (oltre all'aggiornamento del codice a SignalR versione 2 beta). Questa riga di codice imposta in modo esplicito l'URL di connessione di base per SignalR nel server.

    //Set the hubs URL for the connection
    $.connection.hub.url = "http://localhost:8080/signalr";
    
  6. Fare clic con il pulsante destro del mouse sulla soluzione e scegliere Imposta progetti di avvio.... Selezionare il pulsante di opzione Più progetti di avvio e impostare l'azione di entrambi i progetti su Avvia.

    Screenshot della schermata Pagine delle proprietà della soluzione con il pulsante di opzione Più progetti di avvio e le voci Avvia azione evidenziate.

  7. Fare clic con il pulsante destro del mouse su "Default.html" e scegliere Imposta come pagina iniziale.

  8. Eseguire l'applicazione. Verrà avviato il server e la pagina. Potrebbe essere necessario ricaricare la pagina Web (o selezionare Continua nel debugger) se la pagina viene caricata prima dell'avvio del server.

  9. Nel browser specificare un nome utente quando richiesto. Copiare l'URL della pagina in un'altra scheda o finestra del browser e specificare un nome utente diverso. Sarà possibile inviare messaggi da un riquadro del browser all'altro, come nell'esercitazione Introduzione.