[Web] Failed to complete negotiation with the server: XMLHttpRequest error.

[jamiewest]

[Web] Failed to complete negotiation with the server: XMLHttpRequest error.

[milodude]

The XMLHttpRequest error is due to Cors policy issue. I managed to solve it by doing the next steps in a C# application.

1- Define in your startup.cs file a new porperty ie:
readonly string MyAllowSpecificOrigins = "_myAllowSpecificOrigins";

2-At your configure method in the same Startup.cs file add the next line to add Cors
services.AddCors(options => { options.AddPolicy(MyAllowSpecificOrigins, policy => { policy.WithOrigins("http://localhost:58944") .AllowAnyHeader() .AllowAnyMethod() .AllowCredentials(); }); });
Where WithOrigins must be filled with the UI host url you are trying to send the message from.

3- Use Cors at your Configure method in the same Startup.cs file
app.UseCors(MyAllowSpecificOrigins); app.UseRouting();
It must be defined before UseRouting method.

Please give it a shot and let everyone know if this worked out for you.

[AdrianKlm]

I have the same problem. Any information on when it will be fixed?

[agwanyaseen]

Same issue, these plugin not working on flutter web , Any Idea till when it will going to be fixed?

[Codzaa]

@jamiewest Hi !

I bumped into this same error but I found a different solution that does not involve configuring 'CORS'.

final connection = HubConnectionBuilder() .withUrl( 'http://localhost:9670/hub', HttpConnectionOptions( skipNegotiation: true, transport: HttpTransportType.webSockets, logging: (level, message) => print(message), )) .build();

You can simply set skipNegotiation to true, but when reading the docs on the microsoft site (https://docs.microsoft.com/en-us/javascript/api/%40aspnet/signalr/ihttpconnectionoptions?view=signalr-js-latest#skipnegotiation) , it says that you have to be using Web Sockets for this to work.

By the way what are the downsides to setting skipNegotiation to true, any security issues or something?

Environment
Flutter 2.8.0
.Net 5

[Jddl]

            services.AddCors(op =>
            {
                op.AddPolicy("SignalRCors", set =>
                {
                    set.SetIsOriginAllowed(origin => true)
                       .AllowAnyHeader()
                       .AllowAnyMethod()
                       .AllowCredentials();
                });
            });

[laimonas]

@AmbujaAK maybe try to look there
#24 (comment)

[petsve]

Allowing Cors solved it for me too. But the port could change between runs so I made the server code a bit more generic.
In .NET you could use the following:

services.AddCors(options => { options.AddPolicy(MyAllowSpecificOrigins, builder => builder.SetIsOriginAllowed(origin => new Uri(origin).IsLoopback) ); });