Search code examples
c#nginxcorssignalrasp.net-core-signalr

SignalR Cross Domain


I can see this question has been asked many times. Yet all the solutuions are years old and do not work with DotNet 6.0.

I have a SignalR js client. It is rendered from Server A. I have my signalR server on Server B. It is on a fixed IP address.

I try to call from the client this server...

socket= new signalR.HubConnectionBuilder()
    .withUrl("http://X.X.X.X/MyHub")
    .configureLogging(signalR.LogLevel.Information)
    .build();

But I get cors error:

enter image description here

Error: Failed to complete negotiation with the server: Error

my servers are ubuntu 20. The web server is written in asp.net C# ver 6.0

In server B I have in program:

builder.Services.AddCors(options => options.AddPolicy("CorsPolicy", policyBuilder =>
{
    policyBuilder
            .AllowAnyMethod()
            .AllowAnyHeader()
            .AllowAnyOrigin()
            .SetIsOriginAllowed(_ => true); // allow any origin 
}));

Both servers are https.

In my nginx config file I have this:

# Wide-open CORS config for nginx
    location / {
    if ($request_method = 'OPTIONS') {
        add_header 'Access-Control-Allow-Origin' '*';
        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
#
# Custom headers and headers various browsers *should* be OK with but aren't
#
        add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range';
#
# Tell client that this pre-flight info is valid for 20 days
#
        add_header 'Access-Control-Max-Age' 1728000;
        add_header 'Content-Type' 'text/plain; charset=utf-8';
        add_header 'Content-Length' 0;
        return 204;
    }
    if ($request_method = 'POST') {
        add_header 'Access-Control-Allow-Origin' '*' always;
        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS' always;
        add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-  Modified-Since,Cache-Control,Content-Type,Range' always;
        add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range' always;
    }
    if ($request_method = 'GET') {
        add_header 'Access-Control-Allow-Origin' '*' always;
        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS' always;
        add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-        Modified-Since,Cache-Control,Content-Type,Range' always;
        add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range' always;
    }
}

which I got from here:

https://enable-cors.org/server_nginx.html

upstream websocketCloud {
  server 127.0.0.1:9771;
}

Solution

  • Please try to use below cors settings.

    builder.Services.AddCors(options => options.AddPolicy("CorsPolicy", builder =>
    {
        builder.AllowAnyMethod()
            .SetIsOriginAllowed(_ => true)
            .AllowAnyHeader()
            .AllowCredentials();
    }));
    

    Reason

    You are using AllowAnyOrigin() and SetIsOriginAllowed(_ => true) together, and if credentials (such as cookies) are enabled in the CORS configuration and you try to use the .AllowAnyOrigin() method, you will encounter cross-domain issues.

    I know my sample code not security, if it work, you can using below code. It will be safe.

    builder.Services.AddCors(options => options.AddPolicy("CorsPolicy", policy =>
    {
        policy
            .WithOrigins("Your A site") 
            .AllowAnyMethod()
            .AllowAnyHeader()
            .AllowCredentials();
    }));