How to add HubProxy dynamically in SignalR?

Question

JavaScript

There are two hubs UserOrderHub and UserLocationHub.
UserOrderHub - should run when the user is logged in to the site.
UserLocationHub - should be launched when the user has entered the site.
If you run the following methods in this order, only the last UserOrderHub will work.

//Зашел на сайт
initUserLocationHub()
//Авторизовался через форму
initUserOrderHub()

I want that after adding a new hub, the previous hub does not stop working. How is it properly implemented? My version doesn't allow me to do that.

var connection = $.hubConnection();

var initUserOrderHub = function() {

    var UserOrderHub = connection.createHubProxy('UserOrderHub');

    $.signalR.ajaxDefaults.headers = {
     Authorization: 'Bearer {here token string}' 
    };

    UserOrderHub.on('orderStatusChanged', function(data) {
      console.log('orderStatusChanged', data);
    });

    connection.start();
};

var initUserLocationHub = function() {

    var UserLocationHub = connection.createHubProxy('UserLocationHub');

    UserLocationHub.on('courierLocationChanged', function(data) {
      console.log('courierLocationChanged', data);
    });

    connection.start();
};