Example class to handle signalR connections for Aurelia.

signalr-client.js

import $ from 'jquery';
//make sure to run jspm install npm:ms-signalr-client
import 'ms-signalr-client';
import {LogManager} from 'aurelia-framework';

const logger = LogManager.getLogger('communications/signalr');

export class SignalRClient {
  connection = {};
  proxy = {};
  debug = false;
  running = false;
  connection = null;
  
  createHub(hubName) {
    if(!this.connection) {
      this.connection = $.hubConnection('{hubBaseUrl}');
      //The following can be used to pass certain data to the hub on connection such as user id.
      //this.connection.qs = { UserId: '{SomeUserId}', Token: '{SomeUserToken}' };
    }
    hubName = hubName.toLocaleLowerCase();
    if(!this.connection.proxies[hubName]) {
      this.connection.createHubProxy(hubName);
      this.connection.proxies[hubName].funcs = {};
    }
  }
  
  setCallback(hubName, funcName, callBack, cbNameOverride = null) {
    hubName = hubName.toLocaleLowerCase();
    if(!this.connection.proxies[hubName].funcs[funcName]) {
      this.connection.proxies[hubName].funcs[funcName] = {};
      this.connection.proxies[hubName].on(funcName, function(data) {
        for(var func of Object.keys(this.connection.proxies[hubName].funcs[funcName])) {
          this.connection.proxies[hubName].funcs[funcName][func](data);
        }
      });
    }
    this.connection.proxies[hubName].funcs[funcName][cbNameOverride || callBack.name] = function(data) {
      callBack(data);
    };
  }
  
  start() {
    if(!this.running) {
      this.connection.start({ jsonp: true })
        .done(function() { 
          if(this.debug)
            logger.debug('Now connected, connection Id=' + this.connection.id);
        })
        .fail(function() {
          if(this.debug)
            logger.debug('Could not connect');
        });
      this.running = true;
    }
  }
  
  stop(hubName, funcName, callBack, cbNameOverride = null) {
    if(this.running) {
      logger.debug('Hub Stopping');
      if(this.connection.proxies[hubName]) {
        if(this.connection.proxies[hubName].funcs[funcName]) {
          delete this.connection.proxies[hubName].funcs[funcName][cbNameOverride || callBack.name];
        }
        
        if(Object.keys(this.connection.proxies[hubName].funcs[funcName]).length === 0)
          delete this.connection.proxies[hubName].funcs[funcName];
          
        if(Object.keys(this.connection.proxies[hubName].funcs).length === 0)
          delete this.connection.proxies[hubName];
      }
      
      if(Object.keys(this.connection.proxies).length === 0) {
        this.connection.stop();
        this.running = false;
      }
    }
  }
}

//Example usage
import {inject} from 'aurelia-framework';
import {SignalRClient} from 'resources/signalr-client';

@inject(SignalRClient)
export class Test {
  constructor(signalR) {
    this.hubName = 'notificationHub';
    this.hubFunc = 'getNotificaions';
    
    this.hub = signalR;
  }
  
  activate() {
    this.hub.createHub(this.hubName);
    this.hub.setCallback(this.hubName, this.hubFunc, this.handleNotifications);
    this.hub.start();
  }
  
  handleNotifications = (data) => {
    data = $.parseJSON(data);
    //handle notifications
  };
  
  deactivate() {
    this.hub.stop(this.hubName, this.hubFunc, this.handleNotifications);
  }
}