Search code examples
angularjsazurewebsocketserversignalr

SignalR with Angular front-end works on localhost, but doesn't work remotely

I have two Azure Web App Services: front-end (written on Angular) and back-end (written in C# with SignalR). Either of them is placed on its own server, and I am trying to make front-end connect to back-end. Previously everything worked locally when I ran it on localhost, with http, but when I try to do the exact same thing on Azure (I replaced localhost with azure website domains), I get this error in Chrome:

enter image description here

I see that https is replaced by 'wss', which I guess is not fine for SignalR (because it's supposed to fall back to https/https if wss/ws is unavailable, as one of the commenters stated). So apparently my front-end can't see my backend.

What I've tried so far:

  • Changing protocols to http, the way it was with localhost
  • Setting backend to listening to 0.0.0.0:5000
  • Turning on Web Sockets in Azure settings (on both client and server)

What is my problem, and how do I connect my client side to the server side? Thanks.

Solution

  • You should not use port 5000 on App Service. Configure your app so that it only uses the default ports when deployed (effectively port 80 and 443). WSS/SignalR works fine over these default ports.

    You can also see the list of exposed ports.