SignalR hub returning Error during WebSocket handshake: Unexpected response code: 302 Net Core Angular and Azure

Question

I have an angular application that connects to Net Core through SignalR to get info. Locally works perfectly but when the application is doing the request from Azure is throwing this error

WebSocket connection to 'wss://mysite.azurewebsites.net/notifications?id=someId&access_token=sometoken' failed: Error during WebSocket handshake: Unexpected response code: 302 Error: Failed to start the transport 'WebSockets': undefined

But is still returning the data and doing the connection and bringing the info, just annoying errors on console

this is my Angular Side call to signalR

  private createConnection() {
this.hubConnection = new signalR.HubConnectionBuilder()
                            .withUrl(`${this.libraryConfig.api.notification.baseUrl}/notifications`, { accessTokenFactory: () => this.access_token })
                            .build(); 
  }

and this is my code on StartUp on Net Core

services.AddAuthentication(options =>
            {
                options.DefaultAuthenticateScheme = JwtBearerDefaults.AuthenticationScheme;
                options.DefaultChallengeScheme = JwtBearerDefaults.AuthenticationScheme;
            }).AddJwtBearer(options =>
            {
                options.Authority = "https://sts.windows.net/tenat/v2.0";
                options.Audience = Configuration.GetSection("AzureAd").GetSection("Audience").Value;
                options.TokenValidationParameters.ValidateLifetime = true;
              options.Events = new JwtBearerEvents
                {
                    OnMessageReceived = context =>
                    {
                        var accessToken = context.Request.Query["access_token"];

                        // If the request is for our hub...
                        var path = context.HttpContext.Request.Path;
                        if (!string.IsNullOrEmpty(accessToken) &&
                                (path.StartsWithSegments("/notifications")))
                        {
                            // Read the token out of the query string
                            context.Token = accessToken;
                        }
                        return Task.CompletedTask;
                    }
                };

            });

Ive been trying every solution I could find but nothing works.

NOTE: Im using Azure Active Directory to sign in the client

Your hub url is probably not (entirely) correct. Maybe a missing slash at the end? — MikeOne
– MikeOne, Commented Jul 16, 2021 at 21:53
It works locally perfectly and it’s returning everything on Azure not sure what could be causing this errors cause url is the same for the hub at the end — Aracelis S
– Aracelis S, Commented Jul 17, 2021 at 13:28
Enable logging and turn on log streaming in Azure. SignalR uses multiple transport protocols so it's probably failing with socket and using long polling instead: learn.microsoft.com/en-us/aspnet/core/signalr/… — GH DevOps
– GH DevOps, Commented Jul 22, 2021 at 20:07

LarryX · Accepted Answer · 2021-07-16 21:55:37Z

1

You need to enable Websocket in azure app service. It's under Configuration ->General Setings

answered Jul 16, 2021 at 21:55

LarryX

6413 silver badges7 bronze badges

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

10 Comments

Aracelis S Over a year ago

It is enabled for the app service that contains Angular and for the app service that contains the API and still nothing

LarryX Over a year ago

Your site is hosted on example.com Your SignalR app is hosted on signalr.example.com CORS should be configured in the SignalR app to only allow the origin www.example.com. How about cors settings: learn.microsoft.com/en-us/aspnet/core/signalr/…

LarryX Over a year ago

Also please check to make sure createConnection() on angular side happens after authentication is completed. I think it is more like the case as you received 302 redirection

Aracelis S Over a year ago

Connection is happening after authentication. I don’t have a resource on Azure for the SignalR, is using the one created by the net core api app. Should I use one?

LarryX Over a year ago

No that is fine. You don't need to use Signal R service. Can you capture the network traffic (devtool in chrome) to see what the detail about this 302 redirect? also mysite.azurewebsites.net/notifications is your hub, what is your angular app url looks like?

|

Collectives™ on Stack Overflow

SignalR hub returning Error during WebSocket handshake: Unexpected response code: 302 Net Core Angular and Azure

1 Answer 1

10 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

10 Comments

Your Answer

Sign up or log in

Post as a guest

Related