signalr doesnt allow cross origin requests

Question

This is the error that I get.

Failed to load http://example.net/signalr/negotiate?clientProtocol=1.5&connectionData=%5B%7B%22name%22%3A%22chathub%22%7D%5D&_=1539104978557: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://fictitiousite.com' is therefore not allowed access.

This is the request.

    Request URL: http://example.net/signalr/negotiate?clientProtocol=1.5&connectionData=%5B%7B%22name%22%3A%22chathub%22%7D%5D&_=1539104978557
Request Method: GET
Status Code: 200 OK
Remote Address: 52.187.135.79:80
Referrer Policy: no-referrer-when-downgrade

This is the response:

Cache-Control: no-cache
Content-Type: application/json; charset=UTF-8
Expires: -1
Pragma: no-cache

This is how my startup class looks like.

    public class Startup
{
    public void Configuration(IAppBuilder app)
    {
        app.UseCookieAuthentication(new CookieAuthenticationOptions
        {
            AuthenticationMode = AuthenticationMode.Active,
            AuthenticationType = DefaultAuthenticationTypes.ApplicationCookie,
            LoginPath = new PathString("/Index")
        });


        var hubConfiguration = new HubConfiguration();
        hubConfiguration.EnableDetailedErrors = true;
        hubConfiguration.EnableJavaScriptProxies = true;
        hubConfiguration.EnableJSONP = true;

        app.MapSignalR("/signalr", hubConfiguration);



    }
}

I have site 'http://fictitiousite.com' sending 'http://example.net' a request.

I have no problem accepting requests from 'http://fictitiousite.com', the only requests that don't work are those that are signalr related.

These are the definitions inside my web.config.

    <httpProtocol>
  <customHeaders>
    <add name="Access-Control-Allow-Headers" value="Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With" />
     <add name="Access-Control-Allow-Origin" value="http://fictitiousite.com" />     
    <add name="Access-Control-Allow-Methods" value="*" />
    <add name="Access-Control-Allow-Credentials" value="true" />
  </customHeaders>
</httpProtocol>

This is the startup function in my global.asax.

protected void Application_AuthenticateRequest(Object sender, EventArgs e)
{

            string[] allowedIps = new string[] {
                "52.117.111.111",
                "::1"
            };
            Uri MyUrl = Request.Url;
  string host = HttpContext.Current.Request.UserHostAddress;
              string cTheFile = HttpContext.Current.Request.Path;
            if (!cTheFile.EndsWith("Index") )
            {


                if (!allowedIps.Contains(host) )
                {

                    if (HttpContext.Current.User == null ||
                      HttpContext.Current.User.Identity == null ||
                      !HttpContext.Current.User.Identity.IsAuthenticated
                       )
                    {
                        Response.Redirect("~/Index", true);
                        Response.End();
                        return;
                    }

                }


            }
        }

Whats the solution? why does the connection to signalr is being rejected?

UPDATE

The following asp.net mvc solutions don't work.

Solution 1:

public void Configuration(IAppBuilder app)
{
    app.Map("/signalr", map =>
    {
        map.UseCors(CorsOptions.AllowAll);
        var hubConfiguration = new HubConfiguration
        {
        };
        map.RunSignalR(hubConfiguration);
    });
}

The function 'UseCors' doesn't exist i.e. there is a compilation error.

Solution 2:

  RouteTable.Routes.MapHubs(new HubConfiguration()
        {
            EnableCrossDomain = true
        });

Visual Studio 2017 shows that that code is deprecated.

What other solution is there?

Update 2:

I found that I had one package missing.

using Microsoft.Owin.Cors;

This is my new solution.

     app.Map("/signalr", map =>
        {
            // Setup the CORS middleware to run before SignalR.
            // By default this will allow all origins. You can 
            // configure the set of origins and/or http verbs by
            // providing a cors options with a different policy.
            map.UseCors(CorsOptions.AllowAll);
            var hubConfiguration = new HubConfiguration();
            hubConfiguration.EnableDetailedErrors = true;
            hubConfiguration.EnableJavaScriptProxies = true;
            hubConfiguration.EnableJSONP = true;
            // Run the SignalR pipeline. We're not using MapSignalR
            // since this branch already runs under the "/signalr"
            // path.
            map.RunSignalR(hubConfiguration);
        });

I will test it shortly and report back.

After starting the connection, I get this weird message.

jquery.signalR-2.3.0.min.js:9 WebSocket connection `

> to
> 'ws://localhost:64270/signalr/connect?transport=webSockets&clientProtocol=1.5&connectionToken=pHPJmk40WiuD882m3J0bt4cUn9bdIj96CrPg8fntHfjWm8DdrSnaB5UV7HG3LLQfOzRw9ZRBfzd1BMno39bsGaXyuBdkWNK2W%2FPQNKeUuI2ZP0DDRWs50ba5bQx20vXC&connectionData=%5B%7B%22name%22%3A%22chathub%22%7D%5D&tid=2'
> failed: Error during WebSocket handshake: Unexpected response code:
> 403

The connection establishes successfully (it allows me to send messages), but I get that error.

Here are my configurations.

            app.Map("/signalr", map =>
        {
            // Setup the CORS middleware to run before SignalR.
            // By default this will allow all origins. You can 
            // configure the set of origins and/or http verbs by
            // providing a cors options with a different policy.
            map.UseCors(CorsOptions.AllowAll);
            var hubConfiguration = new HubConfiguration();
            hubConfiguration.EnableDetailedErrors = true;
            hubConfiguration.EnableJavaScriptProxies = true;
          //  hubConfiguration.EnableJSONP = true;
            // Run the SignalR pipeline. We're not using MapSignalR
            // since this branch already runs under the "/signalr"
            // path.
            map.RunSignalR(hubConfiguration);
        });

This is how I start a connection.

$.connection.hub.start({ withCredentials: false }).done(function () { });

No error is thrown before reaching that line.