[渣譯文] SignalR 2.0 系列: SignalR 自託管主機

原文: [渣譯文] SignalR 2.0 系列: SignalR 自託管主機

英文渣水平,大夥湊合着看吧……javascript

這是微軟官方SignalR 2.0教程Getting Started with ASP.NET SignalR 2.0系列的翻譯,這裏是第六篇: SignalR 自託管主機css

原文:SignalR Self-Hosthtml

PS.前面的那篇在MVC5上使用SignalR跳過了……MVC5跟HTML的實現徹底同樣,只是將HTML的腳本放在View裏面了,這裏就跳過了。有興趣的同窗能夠本身去看java

概述

SignalR服務器一般在IIS的ASP.NET應用程序上承載,但它也可使用自託管庫來做爲自託管的主機(就像控制檯應用或者Windows服務那樣)。與SignalR 2.0同樣,自託管庫是基於.Net開放式Web接口(OWIN)來構建的。OWIN定義了.Net Web服務器和Web應用程序之間的抽象接口,將Web應用程序從服務器上解耦,使得OWIN能夠在IIS以外創建自託管主機。jquery

爲何不在IIS中託管?參考如下理由:程序員

  • IIS不可用或沒法使用IIS的環境,好比無IIS的服務器場。
  • 考慮到性能,須要避免IIS的額外開銷。
  • SignalR運行在Windows服務或Azure工做角色,或被用於其餘現存的應用程序。

若是爲了性能考慮而是用SignalR自託管主機,建議對IIS中承載的應用程序進行測試,以肯定性能確實獲得了提升。web

建立服務器

在本教程中,您將建立託管在控制檯應用程序中的服務器,固然將其承載在Windows服務及Azure工做角色中也是可行的。跨域

1.以管理員權限運行VS2013,新建一個控制檯應用程序,命名爲"SignalRSelfHost"並肯定。瀏覽器

2.打開程序包管理器控制檯。安全

3.在控制檯中輸入如下命令:

Install-Package Microsoft.AspNet.SignalR.SelfHost 

此命令將SignalR自託管庫添加到項目中。

4.繼續在控制檯中輸入如下命令:

Install-Package Microsoft.Owin.Cors 

此命令將OWIN核心庫添加到項目中,由於SignalR主機與網頁客戶端之間在不一樣的域中運行,該庫將用於跨域支持。因爲SignalR服務和Web客戶端運行在不一樣的端口上,這意味若是想在這些組件間進行通信,則必須啓動這些組件中的跨域功能。
5.替換Program.cs中的代碼:

 1 using System;
 2 using Microsoft.AspNet.SignalR;
 3 using Microsoft.Owin.Hosting;
 4 using Owin;
 5 using Microsoft.Owin.Cors;
 6 
 7 namespace SignalRSelfHost
 8 {
 9     class Program
10     {
11         static void Main(string[] args)
12         {
13             // This will *ONLY* bind to localhost, if you want to bind to all addresses
14             // use http://*:8080 to bind to all addresses. 
15             // See http://msdn.microsoft.com/en-us/library/system.net.httplistener.aspx 
16             // for more information.
17             string url = "http://localhost:8080";
18             using (WebApp.Start(url))
19             {
20                 Console.WriteLine("Server running on {0}", url);
21                 Console.ReadLine();
22             }
23         }
24     }
25     class Startup
26     {
27         public void Configuration(IAppBuilder app)
28         {
29             app.UseCors(CorsOptions.AllowAll);
30             app.MapSignalR();
31         }
32     }
33     public class MyHub : Hub
34     {
35         public void Send(string name, string message)
36         {
37             Clients.All.addMessage(name, message);
38         }
39     }
40 }    

上面的代碼包含了三個類:

  • Program,包含Main方法定義執行的主路徑。在該方法中,指定了本地主機的8080端口用於啓動該Web應用程序。固然你也能夠實現SSL來進一步提升安全。參見How to: Configure a Port with an SSL Certificate
  • Startup,包含了SignalR服務器的配置(本教程中,僅使用了UseCors配置類),而且調用MapSignalR,爲集線器創建路由映射。
  • MyHub,SignalR的集線器實現,用於提供客戶端服務。這個類還包含一個方法:Send,用於將接收到的客戶端消息廣播給全部其餘已鏈接的客戶端。

6.編譯並運行,服務器的地址將顯示在控制檯窗口中。

7.若是執行失敗,除了發生System.Reflection.TargetInvocationException錯誤,你須要以管理員權限從新運行VS2013並執行。

8.在進行下一步前,關閉控制檯應用程序。

使用JavaScript客戶端訪問服務器

在本節中,您將使用同入門教程一致的JS客戶端。咱們只進行一項修改,即定義集線器的URL,做爲自託管主機,服務器並不必定在相同的URL做爲鏈接地址(因爲反向代理及負載平衡),因此URL須要顯示定義。

1.在解決方案資源管理器中,添加ASP.NET Web應用程序,命名爲"JavascriptClient",而後肯定。

 

2.以空模板建立項目。

3.在包管理器控制檯中,在默認項目的下拉列表中選擇「JavascriptClient」項目,並執行如下命令:

 Install-Package Microsoft.AspNet.SignalR.JS 

此命令安裝客戶端所須要的SignalR及jQuery庫。

4.添加一個新的HTML頁面,命名爲Default.HTML。

5.用下面的代碼替換HTML中的內容,一樣須要確認代碼中腳本引用的版本路徑是否一致。

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <title>SignalR Simple Chat</title>
 5     <style type="text/css">
 6         .container {
 7             background-color: #99CCFF;
 8             border: thick solid #808080;
 9             padding: 20px;
10             margin: 20px;
11         }
12     </style>
13 </head>
14 <body>
15     <div class="container">
16         <input type="text" id="message" />
17         <input type="button" id="sendmessage" value="Send" />
18         <input type="hidden" id="displayname" />
19         <ul id="discussion"></ul>
20     </div>
21     <!--Script references. -->
22     <!--Reference the jQuery library. -->
23     <script src="Scripts/jquery-1.6.4.min.js"></script>
24     <!--Reference the SignalR library. -->
25     <script src="Scripts/jquery.signalR-2.0.2.min.js"></script>
26     <!--Reference the autogenerated SignalR hub script. -->
27     <script src="http://localhost:8080/signalr/hubs"></script>
28     <!--Add script to update the page and send messages.-->
29     <script type="text/javascript">
30         $(function () {
31         //Set the hubs URL for the connection
32             $.connection.hub.url = "http://localhost:8080/signalr";
33             
34             // Declare a proxy to reference the hub.
35             var chat = $.connection.myHub;
36             
37             // Create a function that the hub can call to broadcast messages.
38             chat.client.addMessage = function (name, message) {
39                 // Html encode display name and message.
40                 var encodedName = $('<div />').text(name).html();
41                 var encodedMsg = $('<div />').text(message).html();
42                 // Add the message to the page.
43                 $('#discussion').append('<li><strong>' + encodedName
44                     + '</strong>:&nbsp;&nbsp;' + encodedMsg + '</li>');
45             };
46             // Get the user name and store it to prepend to messages.
47             $('#displayname').val(prompt('Enter your name:', ''));
48             // Set initial focus to message input box.
49             $('#message').focus();
50             // Start the connection.
51             $.connection.hub.start().done(function () {
52                 $('#sendmessage').click(function () {
53                     // Call the Send method on the hub.
54                     chat.server.send($('#displayname').val(), $('#message').val());
55                     // Clear text box and reset focus for next comment.
56                     $('#message').val('').focus();
57                 });
58             });
59         });
60     </script>
61 </body>
62 </html>
63         

注意此行代碼聲明瞭SignalR的基礎鏈接URL。

 $.connection.hub.url = "http://localhost:8080/signalr";

6.在解決方案上右擊,設置多個啓動項目爲啓動。

7.在Default.Html上右擊,選擇設爲起始頁。

8.運行該項目,將彈出控制檯服務器及Web頁面,若是Web頁面在控制檯服務器啓動前就執行,你須要從新刷新一次頁面。

9.你能夠輸入用戶名,打開多個瀏覽器來進行多用戶的聊天室測試了。

 

 

做者:帕特里克·弗萊徹-帕特里克·弗萊徹是ASP.NET開發團隊的程序員,做家,目前正在SignalR項目工做。

相關文章
相關標籤/搜索