SignalRプローブ
6792 ワード
一.SingalRを認識する
1.Httpプロトコルはブラウザ側が自発的に要求し、サーバーが自発的に要求を開始できない.ajaxやオリジナルwebsocketを使って開発できますが、難易度は高いです.しかしSignalRを用いてWebSocket開発を簡素化した.
2.SignalRハブクラス(SignalR永続接続)は下位機構である.
3.インスタント通信が可能です.SignalRには、LongLooping(ロングポーリング)、WebSocket(HTML 5のWEBソケット)、Forever Frame(フレームワークを隠すロングリクエスト接続)の3つの伝送モードがあります.
二.コードの作成
1.フロントエンドコード
2.バックエンドHub(TestHub)コード
SignalRの異常のキャプチャ
次にグループの追加と削除を行い、同じグループ内で互いに通信できるようにする
フロントエンドページ
1.Httpプロトコルはブラウザ側が自発的に要求し、サーバーが自発的に要求を開始できない.ajaxやオリジナルwebsocketを使って開発できますが、難易度は高いです.しかしSignalRを用いてWebSocket開発を簡素化した.
2.SignalRハブクラス(SignalR永続接続)は下位機構である.
3.インスタント通信が可能です.SignalRには、LongLooping(ロングポーリング)、WebSocket(HTML 5のWEBソケット)、Forever Frame(フレームワークを隠すロングリクエスト接続)の3つの伝送モードがあります.
二.コードの作成
1.フロントエンドコード
OnLineUser
@* , , jq singalR *@
$('#btnlogin').click(function(){
var username=$('#userName').val();
$.connection.onLineUserHub.server.login(username);
});
$.connection.onLineUserHub.client.onOnlineUserStatusChange=function(msg)
{
var str = val == ture ? " " : " ";
alert(key+" " + str);
}
$.connection.hub,start().done(function(){
alert(" Start");
}).fail(function(){
alert(" ");
})
2.バックエンドHub(TestHub)コード
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using System.Web;
using Microsoft.AspNet.SignalR;
using StackExchange.Redis;
using System.IO;
using System.Text;
namespace SingalRProject
{
public class OnLineUserHub:Hub
{
public async Task Login(string userName)
{
using(ConnectionMultiplexer redis=ConnectionMultiplexer.Connect("localhost:6379"))
{
IDatabase db=readis.GetDatabase();
RedisKey strs="key"+this.ContextConnectionId;
var str=await db.StringGetAsync(strs);
if(str.ToString()==userName)
{
await OnDisConectionted(false);
return;
}
var db.StringSetAsync("key"+UserName,true);
await db.StringSetASync("key_UserName"+this.Context.ConnectionId,userName);
await db.SetAddAsync("key_User",UserName);
RedisValue[]userNames=await db.SetMemberAsync("Key_User");
ReduisKey[]userNamesOnlineKeys=userNames.Select(e=>(RedisKey)("key"+e)).ToArray();
Dictionarydata=new Dictionary();
for(int i=0lu
//
namespace SingalRProject
{
public class OnLineUserHub:HUb
{
private static connStr="localhost:6379"
private Object obj=new Object;
private static ConnectionMultiplexer redis;
private static ConnectionMultiplexer _regist
{
get
{
if(redis==null)
{
lock(obj)
{
if(redis==null||redis.IsConnected)
{
redis=redis.Connect(connStr);
}
return redis;
}
}
}
}
public async Task Db()
{
return _redis.GetDatabase();
}
}
}
SignalRの異常のキャプチャ
public class ExceptoinHubPipelineMoudule:HubPipelineModule
{
protected override void OnIncomingError(ExceptionContext exceptionContext,IHubIncomingInvokerContext invokerContext)
{
//
base.OnIncomingError(exceptionContext,invokerContext);
//exceptionContext.Error
WriteLog(exceptionContext.Error.Message);
dynamic caller=invokerContext.Hub.Clients.Callser;
//
caller.onServerError(exceptionContext.Error.Message);
}
private static string path=@"XXXXX";
public void WriteLog(string ErrorInfo)
{
using(Stream fs=new FileStream(path,FileMode.OpenOrCreate))
{
byte[]info=Encoding.UTF8.GetBytes(ErrorInfo);
fs.Write(info,0,info.Length);
}
}
}
// Global.asax.cs
namespace SignalProhect
{
public class MvcApplication:Syste.Web.HttpApplication
{
proteted void Application_Start()
{
AreaRegistration.RegisterAllAreas();
RouteConfig.RegisterRoutes(RouteTable.Route);
// SignalR
GlobalHost.HubPipeline.AddModule(new HubException());
}
}
}
次にグループの追加と削除を行い、同じグループ内で互いに通信できるようにする
public class GroupHub:Hub
{
public void AddGroup(string groupName)
{
Groups.Add(this.Context.ConnectionId,groupName);
Clients.All.Hello();
}
public void SendGroupMsg(string grouName,string msg)
{
Clients.OthersInGroup(grouName).onMessage(msg);
Clients.OthersInGroup(grouName).OnMessage2(msg)
}
}
フロントエンドページ
<script src="~/Scripts/jquery-3.3.1.js">
</script>
<script src="~/Scripts/jquery.signalR-2.2.2.js"/>
<script src="~/signalr/hubs" type="text/javascript"/>
<div id="msgs">
:
<ul>
</ul></div>
<div id="msg">
:<input type="text" id="groupName1"/>
<button id="btnAddGroup"> </button>
:<input type="text" id="groupName2"/>
:<input type="text" id="message"/>
<button id="btnSendMsg"> </button>
</div>
<script type="text/javascript">
$.connection.groupHub.client.onMessage = function (msg) {
$("<li> 1" + msg + "</li>").appendTo("#msgs");
}
$.connection.groupHub.client.onMessage2 = function (msg) {
$("<li> 1" + msg + "</li>").appendTo("#msgs");
}
$.connection.hub.start().done(function () {
$("<li> " + " "+ "</li>").appendTo("#msgs");
}).fail(function () {
alert(" ");
});
$('#btnAddGroup').click(function () {
var groupName = $('#groupName1').val();
//var message = $('#message').val();
$.connection.groupHub.server.addGroup(groupName);
});
$('#btnSendMsg').click(function () {
var groupName = $('#groupName2').val();
var message = $('#message').val();
$.connection.groupHub.server.sendGroupMsg(groupName, message);
}).fail(function () {
alert(" ");
})
</script>
</code></pre>
<p> </p>
</div>
</div>
</div>
</div>