Simple Web.Api to Web Client messaging - simple example?

Question

User-331009151 posted

Hi, my scenario is as follows

Asp.NET Web.API on it's own URL

Multiple ASP.NET MVC web applications on different URL's using knockout js all making calls to the Web.API.

I have been tasked with making the Web.API be able to send out notifications of activities in real time to all of the clients.

I believe that SignalR is the way forward however all of the examples that I have found so far only show the API and web application using signalr within the same project and not as separate projects. 

I have managed to create a working sample that resembles my needs but with the restriction that it is all in the same project but I am missing the lightbulb moment on how to separate it out.

Could anyone point me to an example or tutorial that may provide me the missing link on how to get a web application to connect speak to web.api signalr hub and have the web.api send out data in real time? 

Answer 1

User475983607 posted

Could anyone point me to an example or tutorial that may provide me the missing link on how to get a web application to connect speak to web.api signalr hub and have the web.api send out data in real time? 

The browser speaks to Web API not a web application.  The web application simply provides the JavaScript API.

Perhaps you are facing a CORS error?

https://docs.microsoft.com/en-us/aspnet/signalr/overview/guide-to-the-api/hubs-api-guide-javascript-client

Answer 2

User-331009151 posted

Sorry, I was not being very clear, suffering from sleep deprivation! What I meant to say was how do I configure my client to connect to my web.api hub?

So if I delcare my hub in my scripts like this

hub = $.connection.queueservice;

hub = $.connection..hub.start();

This obviously does not work as 'queueservice' is not declared in my client, it is declared in my api. How do I tell my client it has to connect to my api?

Answer 3

User475983607 posted

SignalR has two parts; a server and client.  Did you install the SignalR NuGet package?

Maybe the issue is integrating SignalR with Knockout?  Have you tried Knockout support or Google?

Answer 4

User-331009151 posted

Thank you for your replies but I maybe I am not explaining the problem correctly. Ignoring knockout, as I have removed it for now and am just using plain old javascript and jQuery, my problem is how to connect from my client to my api hub. Do I have to define the a hub at my client that is the same as the hub at my api? How do tell my client to connect to the hub at my api and not a hub defined locally? How do I defined the URL for my client hub to connect to?

I have tried to use

$.connection.hub.url = "<URL to my web.api>";

I am assuming this is relevant? But I still cannot create a hub at my client as it complains that it is not defined?

Also I see this error

Uncaught Error: SignalR: Error loading hubs. Ensure your hubs reference is correct, e.g. <script src='/signalr/hubs'></script>.

I think I am close but just missing something. Maybe I will see it better after some sleep.

Answer 5

User475983607 posted

Do you see a reference to <script src='/signalr/hubs'></script> in the source?  Did you install the NuGet package?

Perhaps read the reference docs.

https://docs.microsoft.com/en-us/aspnet/signalr/overview/guide-to-the-api/hubs-api-guide-net-client

Answer 6

User283571144 posted

Hi Scout7,

As far as I know, when you run the singlar hub in the server side, it will auto generate the SignalR hub script.

If you want to access the signlar from client, you also need use the autogenerated  signalR hub script.

Here is two way:

One way is generate the singlar hub script.

https://docs.microsoft.com/en-us/aspnet/signalr/overview/guide-to-the-api/hubs-api-guide-javascript-client#how-to-reference-the-dynamically-generated-proxy 

Another way is directly using the server-side autogenerated  signalR hub script.

For example:

    <script src="Scripts/jquery-1.10.2.min.js"></script>
    <script src="Scripts/jquery.signalR-2.1.2.js"></script>
    <!--Reference the autogenerated SignalR hub script. -->
    <script src="http://localhost:60656/signalr/hubs"></script>

Best Regards,

Brando

Answer 7

User-331009151 posted

That is it, my missing link! It seems so obvious now you have pointed it out but I could not for the life of me see! This is exactly what I needed and I have a working POC to work with to start integrating into my solution. Thank all for your help, especially Brando!