我们可以在按钮点击客户端连接到signalR集线器吗?

时间:2018-02-08 04:30:12

标签: jquery signalr signalr-hub

我正在尝试通过按钮点击事件连接到集线器: 代码:

$("#send").on("click", function () {
            userName = ($("#fname").val()).toString();
            userName = userName.replace(/\s+/g, " ").trim();
            message = ($("#yourMessage").val()).toString();
            message = message.replace(/[\r\n]\s*/g, "");
            message = message.replace(/\s+/g, " ").trim();
            $("#yourMessage").val('');
            $("#send").attr('disabled', 'disabled');
            $("#fname").val(userName);
            if ($("#yourMessage").val() == "Start Typing...") {
                console.log("focus");
                $("#yourMessage").val("");
            }
            console.log(userName + " " + message);
            connectedHub(userName);
            
           
        });
var connectedHub=function(){
            var chatName = $("#fname").val();
            $.connection.hub.qs = "ChatName=" + chatName;
            $.connection.hub.start()
                .done(function () {
                    writeToPage("Somehow!");
                    //The Server side announce() is called here
                    myHub.server.serverAnnounce("Connected!!");
                    $.ajax({
                        url: "/Home/SendMessage?msg=" + message,
                        type: "post",
                        cache: false,
                        success: function (data) {
                            var data2 = JSON.stringify(data);
                            console.log("Success");
                            console.log("Server returned " + data2);
                        },
                        error: function (response) {
                            var err = JSON.stringify(response);
                            alert(err);
                        }

                    })
                .fail(function () {
                    writeToPage("Error!");
                })
                });
            }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

但是在点击事件中我得到了这个错误:

SelectChatType:207 Uncaught TypeError:无法读取未定义的属性“hub”     在connectedHub(SelectChatType:207)     在HTMLInputElement。 (SelectChatType:188)     在HTMLInputElement.dispatch(VM104 jquery-3.3.1.js:5183)     在HTMLInputElement.elemData.handle(VM104 jquery-3.3.1.js:4991)

然而,当“点击”事件功能退出时,此“集线器”会连接并正常工作。

如何在按钮单击事件上连接到服务器端集线器。基本上,我希望OnConnected()仅在按钮单击时触发。

1 个答案:

答案 0 :(得分:0)

以下是我使用SignalR core的方法。首先我做了集线器课程:

public class Chat : Hub
{

    public const string Path = "Chat";

    public async Task Notify(int id) {
        await Clients.All.InvokeAsync("Notified", id);
    }

}

然后在我的创业公司中我用过:

app.UseSignalR(routes =>
{
    routes.MapHub<Chat>(Chat.Path);
});

最后我使用了以下js:

    let connection = new signalR.HubConnection(socketURL + '/Chat.Path');

    connection.on('Notified', data => {
        console.log("Socket content:", data);
    });

    connection.start();

请注意,在我的情况下,Web套接字服务器和客户端位于不同的网站上。这就是我必须使用存储网址的socketURL的原因。你可以试试没有它。