Currently, I am working on a real-time application using SignalR in combination with MVC and AngularJS (SILO). Each cshtml page serves as a Single Page Application (SPA), and within my AngularJS common service, I have incorporated generic operations such as delete and post. Additionally, I have integrated SignalR into my common service. The issue I am facing is that the service is only loaded when a specific SPA loads, causing SignalR to only function within that particular section. My goal is to make SignalR accessible throughout the entire application. How can I achieve this?
self.hub = $.connection.MyHub;
var initializeSignalR = function () {
self.hub.client.addIssue = function (issue) {
alert(JSON.stringify(issue));
};
$.connection.hub.url = "https://sitename.azurewebsites.net/signalr";
$.connection.hub.logging = true;
$.connection.hub.start().done(function () {
var tenant = sessionStorage.getItem("tenantName");
if (tenant !== "") {
self.hub.server.subscribe(tenant);
} else {
console.log("An error occurred");
}
});
};
initializeSignalR();
In addition to this, within my SILO:
viewModelHelper.hub.on('addIssue', function (issueItem) {
issues.push(issueItem);
});
The viewModelHelper represents my service. When moving from one SPA like Home to another SPA like Contacts, the SignalR methods are not executed due to the fact that the service is not initialized in that particular SPA. What steps can I take to ensure SignalR functionality persists across all SPAs even when they are not currently loaded.