SignalRを使用したASP.NETプッシュ通知

例として、SignalRライブラリを使用して、すべてのクライアントの即時通知を含むプリミティブチャットを作成します。





準備



これを行うには、Visual Studioで空のASP.NET空のWebアプリケーションプロジェクトを作成します。



SignalRライブラリ自体は、NuGetを介して単一行に追加されます。



Install-Package SignalR





これにより、jQueryおよびSignalRスクリプトがプロジェクトに追加され、SignalR dllおよびその操作に必要なその他のdllへの参照リンクが追加されます。



サーバーコードを書く





任意のクラスを追加します-チャットと呼びます。SignalR.Hubsで定義されたハブクラスから継承する必要があります



 public class Chat : Hub { public void Send(dynamic message) { Clients.AddChatMessage(message); } }
      
      







このクラスでは、任意のパラメーターを使用して、任意の数のパブリックメソッドを定義できます。これらはすべて、クライアント上の対応するJavaScriptプロキシクラスから利用できます。



この場合、単純なSendを定義します。便宜上、パラメーターは動的になります。



クライアントは親クラスで定義されます。これは動的オブジェクトであり、その任意のメソッドを呼び出しますが、接続されているすべてのクライアントで同じパラメーターを使用して呼び出します。



クライアントコードを書く





単純なマークアップを使用して、chat.htmlドキュメントをhtmlプロジェクトに追加します



 <input type="text" id="msg" /> <input type="button" id="broadcast" value="broadcast" /> <ul id="messages"> </ul>
      
      







必要なJSスクリプトへのリンクを追加し、signalr.jsの後に/ signalr / hubsを追加するため、それに依存します。



 <script src="http://code.jquery.com/jquery-1.7.min.js" type="text/javascript"></script> <script src="/Scripts/jquery.signalR.min.js" type="text/javascript"></script> <script src="/signalr/hubs" type="text/javascript"></script>
      
      







さらに、実際のクライアントスクリプト自体:



 <script type="text/javascript"> $(function () { //    var chat = $.connection.chat; // ,    , //    chat.AddChatMessage = function (msg) { $("#messages").append("<li>" + msg.name + " : " + msg.text + "</li>"); }; //  -        $("#broadcast").click(function () { var msg = { 'name': $.browser.version, 'text': $('#msg').val() }; chat.send(msg); }); //   $.connection.hub.start(); }); </script>
      
      







各クライアントの名前としてブラウザのバージョンを使用しました。



結果として





ビデオに示されているように、すべてのクライアントがプッシュスタイルの通知を同時に受信します。





結論の代わりに





次のように入力して、SignalRの使用例を取得できます。

Install-Package SignalR.Sample







記事およびビデオで説明されている記事のソースをダウンロードします- ここ



2012年明けましておめでとうございます!



All Articles