天天看點

SignalR的Javascript用戶端API使用方式整合

PersistentConnection Hub/生成Proxy模式 Hub/非生成Proxy模式
服務端配置

app.Map("/messageConnection", map =>

           {

               map.RunSignalR<MessageConnection>();

           });

app.Map("/messageHub", map =>

               map.RunSignalR(new Microsoft.AspNet.SignalR.HubConfiguration { EnableJavaScriptProxies = true });

            {

                map.RunSignalR(new Microsoft.AspNet.SignalR.HubConfiguration { EnableJavaScriptProxies = true });

            });

引入js檔案

jquery-1.6.4.min.js

jquery.signalR-2.2.0.min.js

jquery.signalR-2.2.0.min.js

/messageHub/js

上述js檔案是動态生成,其中messageHub的為服務端定義的路徑

建立連接配接 var connection = $.connection("/message"); var connection = $.connection; var connection = $.hubConnection();
開啟連接配接

connection.start()

                .done(function () {

                    connected = true;

                })

                .fail(function () {

                    alert("連接配接失敗");

                });

connection.hub.start()
代理對象

var proxy = connection.MessageService;

MessageService是Hub的名稱

var proxy = connection.createHubProxy("MessageService");
定義用戶端方法

proxy.client.hello = function (message) {

                      console.log(message);   

}

proxy.on("hello", function (message) {        

                  console.log(message);

});

接收消息

connection.received(function (message) {

                alert(message);

通過伺服器調用用戶端方法實作
發送消息 connection.send(message);

通過調用服務端方法實作

proxy.server.hello(message);

proxy.invoke("hello", message);
設定QueryString

在建立connection時指定

var connection = $.connection("/messageConnection", { username: "qs" + username });

connection.hub.qs = { username: "qs" + username }; connection.qs = { username: "qs" + username };
設定Cookie document.cookie = "username=" + username;
設定State proxy.state.ClientType = "HubAutoProxy"; proxy.state.ClientType = "HubNonAutoProxy";