Signalr CORS issue Signalr CORS issue angularjs angularjs

Signalr CORS issue


For those who had the same issue with Angular, SignalR 2.0 and Web API 2.2,

I was able to solve this problem by adding the cors configuration in web.config and not having them in webapiconfig.cs and startup.cs

Changes Made to the web.config under <system.webServer> is as below

<httpProtocol>  <customHeaders>    <add name="Access-Control-Allow-Origin" value="http://localhost" />    <add name="Access-Control-Allow-Methods" value="*" />    <add name="Access-Control-Allow-Credentials" value="true" />  </customHeaders></httpProtocol>


You can look at this snippet from here https://github.com/louislewis2/AngularJSAuthentication/blob/master/AngularJSAuthentication.API/Startup.csand see if it helps you out.

public void Configuration(IAppBuilder app)    {        HttpConfiguration config = new HttpConfiguration();        ConfigureOAuth(app);        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            {                // You can enable JSONP by uncommenting line below.                // JSONP requests are insecure but some older browsers (and some                // versions of IE) require JSONP to work cross domain                //EnableJSONP = true                EnableDetailedErrors = true            };            // Run the SignalR pipeline. We're not using MapSignalR            // since this branch already runs under the "/signalr"            // path.            map.RunSignalR(hubConfiguration);        });        WebApiConfig.Register(config);        app.UseCors(Microsoft.Owin.Cors.CorsOptions.AllowAll);        app.UseWebApi(config);        Database.SetInitializer(new MigrateDatabaseToLatestVersion<AuthContext, AngularJSAuthentication.API.Migrations.Configuration>());    }


I have faced the CORS issue in MVC.net

The issue is SignalR negoiate XHR request is issued with credentials = include thus request always sends user cookies

The server has to reply back with response header Access-Control-Allow-Credentials set to true

First approach and this is due the help of other people , configure it at web.config

<configuration>    <system.webServer>        <httpProtocol>           <customHeaders>              <add name= "Access-Control-Allow-Origin" value="http://yourdomain:port"/>              <add name="Access-Control-Allow-Credentials" value = "true"/>           </customHeaders>        </httpProtocol>    </system.webServer></configuration>

Second approach which I fought to make it work is via code using OWIN CORS

[assembly::OwinStartup(typeof(WebHub.HubStartup), "Configuration"]namespace WebHub{public class HubStartUp{    public void Configuration(IAppBuilder app)    {        var corsPolicy = new CorsPolicy        {            AllowAnyMethod = true,            AllowAnyHeader = true,            SupportsCredentials = true,        };        corsPolicy.Origins.Add("http://yourdomain:port");        var corsOptions = new CorsOptions        {            PolicyProvider = new CorsPolicyProvider            {                PolicyResolver = context =>                {                    context.Headers.Add("Access-Control-Allow-Credentials", new[] { "true" });                    return Task.FromResult(corsPolicy);                }            }        };        app.Map("/signalR", map =>        {            map.UseCors(corsOptions);            var config = new HubConfiguration();            map.RunSignalR(config);        });    }}}