如何将集线器内容从任何服务器带到“另一个服务器”项目集线器?

时间:2018-09-11 11:15:15

标签: c# asp.net-mvc signalr signalr-hub

代码的安排和取悦的地方存在混淆,因此我希望找到以下解释:

当我有一台服务器“ https://localhost:48009/”时,该应用程序满足了Signal-R的所有要求,并且还存在集线器。 文件夹中的集线器中有一个集线器类ChatHub.cs

using System;
using System.Web;
using Microsoft.AspNet.SignalR;
namespace SignalRChat
{
    public class ChatHub : Hub
    {
        public void Send(string name, string message)
        {
            // Call the addNewMessageToPage method to update clients.
            Clients.All.addNewMessageToPage(name, message);
        }
    }
}

Chat.cshtml

@{
    ViewBag.Title = "Chat";
}
<h2>Chat</h2>
<div class="container">
    <input type="text" id="message" />
    <input type="button" id="sendmessage" value="Send" />
    <input type="hidden" id="displayname" />
    <ul id="discussion">
    </ul>
</div>
@section scripts {
    <!--Script references. -->
    <!--The jQuery library is required and is referenced by default in _Layout.cshtml. -->
    <!--Reference the SignalR library. -->
    <script src="~/Scripts/jquery.signalR-2.1.0.min.js"></script>
    <!--Reference the autogenerated SignalR hub script. -->
    <script src="~/signalr/hubs"></script>
    <!--SignalR script to update the chat page and send messages.--> 
    <script>
        $(function () {
            // Reference the auto-generated proxy for the hub.  
            var chat = $.connection.chatHub;
            // Create a function that the hub can call back to display messages.
            chat.client.addNewMessageToPage = function (name, message) {
                // Add the message to the page. 
                $('#discussion').append('<li><strong>' + htmlEncode(name) 
                    + '</strong>: ' + htmlEncode(message) + '</li>');
            };
            // Get the user name and store it to prepend to messages.
            $('#displayname').val(prompt('Enter your name:', ''));
            // Set initial focus to message input box.  
            $('#message').focus();
            // Start the connection.
            $.connection.hub.start().done(function () {
                $('#sendmessage').click(function () {
                    // Call the Send method on the hub. 
                    chat.server.send($('#displayname').val(), $('#message').val());
                    // Clear text box and reset focus for next comment. 
                    $('#message').val('').focus();
                });
            });
        });
        // This optional function html-encodes messages for display in the page.
        function htmlEncode(value) {
            var encodedValue = $('<div />').text(value).html();
            return encodedValue;
        }
    </script>
}

在多个浏览器上打开页面时,一切正常

所有操作均在服务器“ https://localhost:48009/”内

我碰巧在另一台服务器上有另一个项目,例如“ http://localhost:18098/

index.cshtml

@{
    ViewBag.Title = "index";
}
<h2>Chat</h2>
<div class="container">
    <input type="text" id="message" />
    <input type="button" id="sendmessage" value="Send" />
    <input type="hidden" id="displayname" />
    <ul id="discussion">
    </ul>
</div>
@section scripts {
    <!--Script references. -->
    <!--The jQuery library is required and is referenced by default in _Layout.cshtml. -->
    <!--Reference the SignalR library. -->
    <script src="~/Scripts/jquery.signalR-2.1.0.min.js"></script>
    <!--Reference the autogenerated SignalR hub script. -->
      ///////////////////gotohub here
    <script src="https://localhost:48009//signalr/hubs"></script>
    <!--SignalR script to update the chat page and send messages.--> 


    <script>
        $(function () {
            // Reference the auto-generated proxy for the hub. 
              ///////Link to the other server 
            var chat = $.connection.chatHub.url="https://localhost:48009/";
            // Create a function that the hub can call back to display messages.
            chat.client.addNewMessageToPage = function (name, message) {
                // Add the message to the page. 
                $('#discussion').append('<li><strong>' + htmlEncode(name) 
                    + '</strong>: ' + htmlEncode(message) + '</li>');
            };
            // Get the user name and store it to prepend to messages.
            $('#displayname').val(prompt('Enter your name:', ''));
            // Set initial focus to message input box.  
            $('#message').focus();
            // Start the connection.
            $.connection.hub.start().done(function () {
                $('#sendmessage').click(function () {
                    // Call the Send method on the hub. 
                    chat.server.send($('#displayname').val(), $('#message').val());
                    // Clear text box and reset focus for next comment. 
                    $('#message').val('').focus();
                });
            });
        });
        // This optional function html-encodes messages for display in the page.
        function htmlEncode(value) {
            var encodedValue = $('<div />').text(value).html();
            return encodedValue;
        }
    </script>
}

在这里,我似乎也将解决方案应用于类似的问题。这种方法正确吗?

了解另一台服务器http://localhost:18098/”它还配备了Signal-R

我想将Hub的内容从那里带到另一台服务器 Hub。

1 个答案:

答案 0 :(得分:3)

1。添加Nuget软件包SignalR

2。将“启动”类添加到App_Start

namespace YourProjectname.App_Start {
    public class Startup {
        public void Configuration(IAppBuilder app) {
            app.MapSignalR("/signalr",new Microsoft.AspNet.SignalR.HubConfiguration());
        }
    }
}

4。将您的web.config更改为以下

    <appSettings>    
        <add key="owin:AppStartup" value="YourProjectName.App_Start.Startup"/>
    </appSettings>

      <system.webServer>
              <httpProtocol> 
                 <customHeaders>        
                   <add name="Access-Control-Allow-Origin" value="http://192.168.43.174:9090" />        
                       <add name="Access-Control-Allow-Credentials" value="true" />
                       <add name="Access-Control-Allow-Methods" value="true" />
                 </customHeaders>
              </httpProtocol>
     </system.webServer>

*如果您有很多客户,则允许上述每个请求

  1. 在您的项目下添加Hub文件夹

  2. 将集线器类修改为波纹管

    namespace YourProjectName.ChatHub {
        [HubName("ChatHub")]
        public class ChatHub : Hub {
            [HubMethodName("Sendchat")]
            public void Send(String Message,String Touser) {
                 Clients.Client(Touser).GotMessages(Message);//send messages to specific user
               //Clients.All.GotMessages(Message); //seln messages to all user
                String CName = Message;
            }
    
            [HubMethodName("hubconnect")]
            public void Get_Connect(String Name) {
                Clients.All.GotMessages(Name +" Connected  Connection Id is "+ this.Context.ConnectionId);
                String CName = Name;
            }
    
            public override System.Threading.Tasks.Task OnConnected() {
                return base.OnConnected();
            }
    
            public override System.Threading.Tasks.Task OnReconnected() {
                return base.OnReconnected();
            }
    
            public override System.Threading.Tasks.Task OnDisconnected(bool stopCalled) {
                return base.OnDisconnected(stopCalled);
            }
        }
    }
    
  3. 您只想安装Client,安装SignalR Client

将您的Cshtml更改为波纹管

<h2>Chat</h2>
<div class="container">
    <input type="text" id="name" placeholder="tousername"/>
    <input type="text" id="message" placeholder="message" />
    <input type="button" id="sendmessage" value="Send" />
    <input type="hidden" id="displayname" />
    <ul id="discussion"></ul>
</div>

@section scripts{      
<script src="~/Scripts/jquery.signalR-2.3.0.min.js"></script>   
<script>
        $(function () {
             //Create Hub Connection
        var connection = $.hubConnection("http://192.168.43.174:9092", { useDefaultath: false });
       //Add your Server above IP Addess

                        //Create Chat Connection
        var proxy = connection.createHubProxy("ChatHub");
        $('#displayname').val(prompt('Enter your name:', ''));
        //Connection stablished
        connection.start().done(function () {

           try {                 
                proxy.invoke("hubconnect", $('#displayname').val());
            } catch (e) {
                alert(e.message);
            }
        });

            $('#sendmessage').on('click', function () {
            //Send Messages to specific User
            proxy.invoke("Sendchat", $('#message').val(), $('#name').val());
        });

            //Receive Messages from User
        proxy.on("GotMessages", function (Message) {
            alert(Message);
            $('#discussion').append('<div>' + Message + '</br></div>');
        }); 
     }); 
</script>
}

for mor information