Explication détaillée de l'utilisation de la technologie SignalR sous ASP.NET Core

Cet article présente principalement l'utilisation de la technologie SignalR sous ASP.NET Core. L'éditeur pense que c'est plutôt bien, je vais donc le partager avec vous maintenant et le donner comme référence. Suivons l'éditeur et jetons un coup d'œil

1 Préface

La dernière fois, nous avons parlé de la façon d'utiliser ASP.NET Core. Utilisez WebSocket dans . Le protagoniste cette fois est SignalR, qui nous fournit un framework pour simplifier le fonctionnement de WebSocket.

ASP .NET SignalR est une bibliothèque de classes sous ASP.NET qui peut réaliser une communication en temps réel dans les projets Web ASP.NET. Qu'est-ce que la communication en temps réel sur le Web ? Il s'agit de permettre au client (page Web) et au serveur de se notifier mutuellement les messages et les méthodes d'appel. Bien entendu, il s'agit d'une opération en temps réel. WebSockets est une nouvelle API fournie par HTML5, qui peut établir une connexion Socket entre une page Web et le serveur. Lorsque les WebSockets sont disponibles (c'est-à-dire que le navigateur prend en charge HTML5), SignalR utilise WebSockets. Lorsqu'il n'est pas pris en charge, SignalR les utilisera. d'autres technologies pour assurer le même effet.

Bien entendu, SignalR fournit également une API de haut niveau très simple et facile à utiliser, qui permet au serveur d'appeler des fonctions JavaScript sur le client individuellement ou par lots, et il est très pratique de gérer les connexions , comme la connexion du client au serveur, ou la déconnexion, le regroupement de clients et l'autorisation du client sont tous très faciles à mettre en œuvre à l'aide de SignalR.

2. Situation actuelle de SignalR

Nous savons que SignalR n'est pas inclus dans la version ASP.NET Core 1.0.x, mais dans la technologie SignalR. plan Il est intégré dans ASP.NET Core version 1.2, et son équipe de développement utilisera également TypeScript pour réécrire son client javascript. Le côté serveur sera également proche de la méthode de développement d'ASP.NET Core, par exemple, il sera intégré. dans le cadre d’injection de dépendances ASP.NET Core.

La situation actuelle est que la technologie SignalR ne peut pas être utilisée en 1.0. Les démos implémentées dans cet article sont toutes réalisées sous 1.1.

3. Intégrer SignalR

Bien sûr, ASP.NET Core 1.2 est encore loin de sa sortie officielle, et c'est actuellement le cas. pas prêt à intégrer la solution SignalR, nous devons intégrer SignalR manuellement.

Pour utiliser SignalR dans ASP.NET Core, vous devez d'abord référencer le package NuGet de Microsoft.AspNetCore.SignalR.Server et Microsoft.AspNetCore.WebSockets.

Bien sûr, comme mentionné ci-dessus, il n'existe actuellement aucun ASP.NET Core qui n'intègre SignalR, donc le package SignalR est introuvable sur NUGET. Si nous voulons ajouter une référence, nous devons aller sur . MyGet pour le trouver.

1. Ajoutez une source NuGet

Créez un nouveau fichier nommé NuGet.Config dans le répertoire racine du programme avec le contenu suivant :

<?xml version="0" encoding="utf-8"?>
<configuration>
  <packageSources>
    <clear/>
      <add key="aspnetcidev" value="https://dotnetmygetorg/F/aspnetcore-ci-dev/api/v3/indexjson"/>
      <add key="apinugetorg" value="https://apinugetorg/v3/indexjson"/>
  </packageSources>
</configuration>

Bien sûr, nous pouvons également référencer cet assembly en définissant la source des packages NuGet dans Visual Studio.

2. Ajoutez une référence à project.json

"MicrosoftAspNetCoreSignalRServer": "0-*",
"MicrosoftAspNetCoreWebSockets": "0-*"

Vous pouvez remarquer que la version de SignalR est la version alpha 0.2.0, donc les versions ultérieures peuvent beaucoup changer ! J'ai entendu dire que c'était facile à réécrire.

Il convient de noter que SignalR n'est actuellement disponible que sur ASP.NET Core 1.1 et supérieur. La version du SDK .NET Core que j'ai utilisée dans cet article est 1.0.0-preview2-003131, je cite donc les étudiants qui. Si vous avez des problèmes, vous pouvez essayer de changer la version de CoreApp en 1.1, et tous les assemblys AspNetCore sont également modifiés en version 1.1.

3. Ajouter le code de configuration

Nous devons ajouter le code suivant dans la méthode ConfigureServices de la classe Startup :

public void ConfigureServices(IServiceCollection services)
{
   servicesAddSignalR(options => 
   {
     optionsHubsEnableDetailedErrors = true;
   });
}

Ajoutez le code suivant dans la méthode Configure de la classe Startup :

appUseWebSockets();
appUseSignalR();

4. Ajouter une classe HUB

Ici, nous implémentons uniquement une petite démo, un simple salon de discussion, plusieurs personnes peuvent entrer et voir les messages envoyés par chacune :

public class ChatHub : Hub
{
    public static List<string> ConnectedUsers;

    public void Send(string originatorUser, string message)
    {
      ClientsAllmessageReceived(originatorUser, message);
    }

    public void Connect(string newUser)
    {
      if (ConnectedUsers == null)
        ConnectedUsers = new List<string>();

      ConnectedUsersAdd(newUser);
      ClientsCallergetConnectedUsers(ConnectedUsers);
      ClientsOthersnewUserAdded(newUser);
    }
}

5. Le client prend en charge

Créez un fichier statique HTML nommé chat.html dans le répertoire wwwroot avec le contenu suivant :

<!DOCTYPE html>
<html>
<head>
  <title>Awesome Chat Application</title>
  <meta charset="utf-8" />
</head>
<body>
  <style type="text/css">
    userListp{ float: right; }
  </style>
  <ul id="messages"></ul>
  <input type="text" id="messageBox" />
  <input type="button" id="sendMessage" value="Send Message!" />
  <p class="userListp">
    <ul id="userList"> </ul>
  </p>
 
  <script src="http://ajaxaspnetcdncom/ajax/jQuery/jquery-minjs"></script>
  <script src="http://ajaxaspnetcdncom/ajax/signalr/jquerysignalr-minjs"></script>
  <script src="signalr/hubs"></script>
  <script src="chatjs"></script>
</body>
</html>

Créez un chat.js dans le même répertoire et ajoutez le script pour implémenter la fonction :

var userName = prompt("Enter your name: ");
var chat = $connectionchatHub;
chatclientmessageReceived = function (originatorUser, message) {
  $("#messages")append(&#39;<li><strong>&#39; + originatorUser + &#39;</strong>: &#39; + message);
};
chatclientgetConnectedUsers = function (userList) {
  for (var i = 0; i < userListlength; i++)
    addUser(userList[i]);
};
chatclientnewUserAdded = function (newUser) {
  addUser(newUser);
}
$("#messageBox")focus();
$("#sendMessage")click(function () {
  chatserversend(userName, $("#messageBox")val());
  $("#messageBox")val("");
  $("#messageBox")focus();
});
$("#messageBox")keyup(function (event) {
  if (eventkeyCode == 13)
    $("#sendMessage")click();
});
function addUser(user){
  $("#userList")append(&#39;<li>&#39; + user + &#39;</li>&#39;);
}
$connectionhublogging = true;
$connectionhubstart()done(function () {
  chatserverconnect(userName);
});

Enfin, lançons-le :

Ce qui précède est l'intégralité du contenu de cet article, j'espère que ce sera le cas. utile à l'apprentissage de chacun. Veuillez soutenir le site Web PHP chinois.

Pour des informations plus détaillées sur l'utilisation de la technologie SignalR sous ASP.NET Core, veuillez prêter attention au site Web PHP chinois !