How to join a group using SignalR

Question

I am new to using SignalR (started today), Pretty simple to send a message to ALL clients connected, but now I want to just send to a group. I cannot find simple documentation on how to join on the client side. If anyone can help, how can I SIMPLY join a group on the javascript side. Thanks for any help.

public class EventHub : Hub
{
    public void SendNewMedia(MediaInfoViewModel model,Guid eventId)
    {
        Clients.Group(eventId.ToString()).setupmedia(model);
    }
}
//Controller that is sending client new data
var eventHub = GlobalHost.ConnectionManager.GetHubContext<EventHub>();
              var result = eventHub.Clients.Group(eventId.ToString()).setupmedia(eventViewer);

//Finally the javascript. Not sure how to setup just for a group
$(function () {
    var event = $.connection.eventHub;
    event.client.setupmedia = function (newMedia) {

        $('#photolist').prepend('<li><img src="' + newMedia.MediaUrl + '" class="img-polaroid span2"/></li>');
    };
    $.connection.hub.start(function() {
        event.server.create(eventID);//I know this is wrong but not sure how to connect
    }).done(function () {
        alert('conntected. Ready to retrieve data!');
    });
});

score 44 · Accepted Answer · answered Jun 26 '13 at 00:44

44

You can't. If you could join a group from javascript then anyone may use your code to join any group which breaks security. If you really need to do that - create a method on the server side that takes a group name as parameter and adds the client to the group.

public void JoinGroup(string groupName)
{
    this.Groups.Add(this.Context.ConnectionId, groupName);
}

Afterwards, call it from JS like that

eventHub.server.joinGroup("my-awsm-group");

answered Jun 26 '13 at 00:44

Nikola Dimitroff

6,127
2
25
31

Kind of surprised this is the only answer. Being new to Signal R I'm curious myself what the alternative patterns are for joining a group? Are there ways to join a client on the server side for instance that aren't part of a direct explicit interaction like this (where the JS client calls a method). Like can you join a client to a group on the server side if you have their client ID and then they magically become part of it? PS. this really isn't a different question - just more of the same if you (or anyone else) had any other thoughts – Simon_Weaver May 19 '15 at 22:45
1

Group management is done only on the server, so yeah - if you have the user's connection id you can add him to any group. In fact, that's the way it's supposed to work. – Nikola Dimitroff May 20 '15 at 07:38
How you get the _eventHub_ in the client using pure JS (no Angular or Jquery plugin) ? I'm using the latest **signalr.js** from Microsoft (v4.2.2) and I can create and use a connection and subscribe, but I don't know how to call a method exposed in the Hub. – Alex 75 Mar 02 '20 at 14:00

jaba_y · Answer 2 · 2020-11-23T05:26:35.033

-------------------------In Javascript (ReactJs)---------------------------------

const connection = new signalR.HubConnectionBuilder()
  .withUrl("connectionUrl")
  .build();
connection.start().then(res => {
    connection.invoke("JoinGroup", "groupName")  //JoinGroup is C# method name
        .catch(err => {
            console.log(err);
        });
}).catch(err => {
            console.log(err);
        });;

----------------In C# (.Net Core)-----------------

public class NotificationHub : Hub
    {
        public Task JoinGroup(string groupName)
        {
                return Groups.AddToGroupAsync(Context.ConnectionId, groupName);
        }
    }

Problems with this, as written (1) where is the async in Task (2) what are you returning, you defined Task as void. — joedotnot, Oct 17 '21 at 00:31

score 2 · Answer 3 · answered Oct 23 '19 at 15:44

Just in case you come across this question now (like I did), here is an example for how to implement an azure function to support groups.

https://learn.microsoft.com/en-us/azure/azure-functions/functions-bindings-signalr-service#2x-c-group-management-output-examples

How to join a group using SignalR

3 Answers3