Signal-R Calling another server method after receiving previous call data - .net-core

Question

I am just reading the Microsoft tutorial on Signal-R and want to use it instead of Ajax in .Net Core, Considering the following code from Microsoft, Is there any way we can do another server call, after receiving data from the first call in the broadcastMessage function (that is defined as a javascript function)?
<script type="text/javascript">
$(function () {
// Declare a proxy to reference the hub.
var chat = $.connection.chatHub;
// Create a function that the hub can call to broadcast messages.
chat.client.broadcastMessage = function (name, message) {
// Html encode display name and message.
var encodedName = $('<div />').text(name).html();
var encodedMsg = $('<div />').text(message).html();
// Add the message to the page.
$('#discussion').append('<li><strong>' + encodedName
+ '</strong>: ' + encodedMsg + '</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();
});
});
});
</script>
So that we can examine data received and conditionally initiate another call.
Or if all server calls should be put inside $.connection.hub.start().done(function () {?

Answer 1

You can call other methods after the message is received like this:
TypeScript example:
//Start connection with message controller
public startConnectionMessage = () => {
this.hubMessageConnection = new signalR.HubConnectionBuilder()
.configureLogging(signalR.LogLevel.Debug)
.withUrl('http://localhost:20000/notifications')
.build();
this.hubMessageConnection
.start()
.then(() => {
//after connection started
console.log('Notifications Service connection started!');
// Start the Group Listener.
this.addTranferGroupMessageListener();
// Get ConnectionID.
this.GetConnectionID();
})
.catch(err => console.log('Error while starting connection: ' + err))
}
// Group channel listner.
public addTranferGroupMessageListener = () => {
this.hubMessageConnection.on("groupMessage", (data: any) => {
console.log(data);
});
}
private GetConnectionID() {
this.hubMessageConnection.invoke("GetConnectionID")
.then((connectionID: string) => {
console.log("Recived connectionID = " + connectionID);
// call the method to register AppContextData.
this.sendApplicationContextData(connectionID)
}).catch((error: Error) => {
console.log("Error: " + error);
})
}
private sendApplicationContextData(connectionID: string) {
// add the received connectionID to the payload.
this.connection.ConnectionID = connectionID;
console.log("Sending ApplicationData.");
console.log(this.connection);
//inovke server side method to pass AppContext data.
this.hubMessageConnection.invoke("RegisterAppContextData", this.connection)
.then()
.catch((error: Error) => {
console.log("Error: " + error);
});
}
You can see that after connection is established, I invok a hub method that simply returns me a connectionID and based on connectionID I invoke another method sending that parameter. The server side hub methods are:
public string GetConnectionID()
{
return this.Context.ConnectionId;
}
public async Task RegisterAppContextData(AppContextData data)
{
// Calls the groups Manager.
await this.MapClientToGroups(data);
}