.NetCore SignalR + React - CORS call not working

Question

i have an issue with SignalR, in the negotiate stage, i am calling from a reactjs site, to a .net core signalR hub, the error is that the CORS headers are not there, i have CORS up and working, since the entire site calls the backend in another server and all the calls works fine.

this is the error i get:

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access.

This is the client code:

SignalR() {
    const connection = new signalR.HubConnectionBuilder()
      .withUrl(process.env.API_URL + "/HealthMonitorHub", options => {
        options.UseDefaultCredentials = true;
    })
    .build();
    connection
      .start()
      .then(() => console.log('Connection started!'))
      .catch(err => console.log('Error while establishing connection => ' + err));
  }

And this is the server side net core startup:

public void ConfigureServices(IServiceCollection services)
{
    services.AddSignalR();
    services.AddCors(o => o.AddPolicy("CorsPolicy", builder =>
    {
        builder.AllowAnyMethod()
        .AllowAnyHeader()
        .WithOrigins("*")
        .AllowCredentials();
    }));
    services.Configure<MvcOptions>(options =>
    {
         options.Filters.Add(new CorsAuthorizationFilterFactory("CorsPolicy"));
    });
    services.AddMvc();
 }

 public void Configure(IApplicationBuilder app, IHostingEnvironment env)
 {
     app.UseCors("CorsPolicy");
     if (env.IsDevelopment())
         app.UseDeveloperExceptionPage();
     else
         app.UseExceptionHandler("/error");

     app.UseSignalR(route =>
     {
          route.MapHub<HealthMonitorHub>("/HealthMonitorHub");
     });
     app.UseMvc();
  }

I know the CORS config is good, i dont know if something is missing on the react side, I am using the same version on both side, 1.0.3 and net core 2.1.402.

Any ideas?

Thanks

mariusd96 mariusd96 · Accepted Answer · 2018-10-08T13:47:19

Try the following in the Configure method:

app.UseCors(builder => builder.AllowAnyOrigin().AllowAnyMethod().AllowAnyHeader().AllowCredentials());

instead of

app.UseCors("CorsPolicy");

.NetCore SignalR + React - CORS call not working

1 Answers