SignalR API in angular 2 client is not receiving notification

Question

I have signalr server running. That keeps sending updated information.

I have following code in index.html within tag

$.connection.hub.url = "http://localhost:8080/signalr";
// Declare a proxy to reference the hub.
var chat = $.connection.myHub;
// Create a function that the hub can call to broadcast messages.
chat.client.addMessage = function (name, message) {
// Html encode display name and message.
console.log ("chat.client.addMessage.index");
};

And same is added in component ts file

 ngOnInit () {
    jQuery.connection.hub.url = "http://localhost:8080/signalr";
    // Declare a proxy to reference the hub.
    var chat = jQuery.connection.myHub;
    // Create a function that the hub can call to broadcast messages.
    chat.client.addMessage = function (name, message) {
    // Html encode display name and message.
      console.log ("chat.client.addMessage.index");      ""
    };
  }

The addMessage is called from SignalR Hub server. And is received by addMessage registered in index.html but not by function registered in component ts.

On debug, I could find that function has got registered in both places. I tried registering different functions and server calling both functions. But in either cases the function registered in component/ type script is not called.

any help will be thankful

Could you please the below answer as the accepted solution so it helps others? — Ben Cameron
– Ben Cameron, Commented Nov 16, 2017 at 4:22

Ben Cameron · Accepted Answer · 2017-01-27 10:12:27Z

1

I had similar issues getting SigR to work but managed to get it to work in the end. Depending on how you are import jQuery for the connection functions I got it to work like this...

this.connection = $.hubConnection("Url");
this.proxy = this.connection.createHubProxy("HubName");

this.proxy.on('someFunctionName', (data: any) => {
     console.log(data);
});

answered Jan 27, 2017 at 10:12

Ben Cameron

4,4636 gold badges54 silver badges78 bronze badges

Sign up to request clarification or add additional context in comments.

9 Comments

Paperless Over a year ago

var connection = jQuery.connection('localhost:8080/signalr'); var proxy = connection.createHubProxy("myHub"); It fails with message during run time EXCEPTION: connection.createHubProxy is not a function

Ben Cameron Over a year ago

It depends how you are bringing in jquery like l mentioned. Add this to the top of the file... declare var $: any;

Paperless Over a year ago

Now I have following code: after declare $ : any ngOnInit () { $.connection.hub.url = "localhost:8080/signalr"; var chat = jQuery.connection.myHub; $.connection.hub.start().done(function () { }); chat.client.addMessage = function (name, message) { }; } My web server is running in port 3000 and singnalr is running on 8080 I am getting following error. But I do not see any of this error if I include the same code in index.html

Paperless Over a year ago

(index):1 XMLHttpRequest cannot load extsgo.com/api/tracker/…. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'localhost:3000' is therefore not allowed access. The response had HTTP status code 404. zone.js:1382 GET extsgo.com/api/tracker?tracking_id=47 net::ERR_CONNECTION_CLOSED

Paperless Over a year ago

ok so this error went if I move the call back method before calling start. So now I do not see any error. But now when server sends message. addMessage function is not called in client.

|

Collectives™ on Stack Overflow

SignalR API in angular 2 client is not receiving notification

1 Answer 1

9 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

9 Comments

Your Answer

Sign up or log in

Post as a guest

Related