SignalR: Error loading hubs. 404 not found

Question

I am working with an angular 5 app, That I am trying to implement SignalR. And I am getting 2 errors that i would imagine are the same thing. First is :

Failed to load resource: the server responded with a status of 404 (Not Found)

and the second is:

ERROR Error: SignalR: Error loading hubs. Ensure your hubs reference is correct, e.g. .

That said, I have been researching this and saw a few options that mostly referenced an older version of siganalR.

I have followed the Tutorial on this and added a Hub

[HubName("EventContractHub")]
public class EventContractHub : Hub, IClientHub
{
    public void SendId(int id)
    {
        Clients.All.Send(id);
    }
}

with a Startup.cs class that looks like...

[assembly:OwinStartUp(typeof(blah.Startup))]
namespace blah
{
   public class Startup
   {
      public void Configuration(IAppBuilder app)
      {
          // Other configuration here
          app.MapSignalR();
      }
   }
}

And My _Layout.cshtml has a referance that looks like:

<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/jquery.signalR-2.2.3.min.js"></script>
<!--Reference the autogenerated SignalR hub script. -->
<script src="~/signalr/hubs"></script>

Does anyone know why this would be happening right now?

The 404 not found url is : http://localhost/IntelliM/signalr/hubs

I should mention that I have an api running on same server using Owin as well. I don't know if that will change anything. If so I can post the configuration for that too.

Please understand that I had to remove some of the code here, I have left the relevent code:

   public void Configuration(IAppBuilder app)
    {

        if (/*Logic for License*/)
        {
            app.Map("/identity", ssocf =>
            {

            });
        }



        JwtSecurityTokenHandler.InboundClaimTypeMap = new Dictionary<string, string>();

        app.UseCookieAuthentication(new CookieAuthenticationOptions
        {
            AuthenticationType = "Cookies"
        });



        app.UseOpenIdConnectAuthenticationPatched(new OpenIdConnectAuthenticationOptions
        {


            SignInAsAuthenticationType = "Cookies",

            Notifications = new OpenIdConnectAuthenticationNotifications
            {
                AuthorizationCodeReceived = async n =>
                {

                    /*
                     * Add Clams here
                     */
                },

                SecurityTokenValidated = async n =>
                {

                        /*Create Token Here*/
                },

                RedirectToIdentityProvider = n =>
                {

                }
            }
        });


        //Setting WebAPI Auth
        var config = new HttpConfiguration();
        config.Formatters.Remove(config.Formatters.XmlFormatter);
        //config.SuppressDefaultHostAuthentication();

        config.Filters.Add(new HostAuthenticationFilter(OAuthDefaults.AuthenticationType));

        config.MapHttpAttributeRoutes();

        config.Routes.MapHttpRoute(
            name: "DefaultApi",
            routeTemplate: "api/{controller}/{action}/{id}",
            defaults: new { id = RouteParameter.Optional }
        );
        app.UseIdentityServerBearerTokenAuthentication(new IdentityServerBearerTokenAuthenticationOptions
        {
            Authority = authority
        });

        app.UseWebApi(config);
        app.MapSignalR();
    }

}

Answer 1

Checking the notes from the linked tutorial

Important

When you add SignalR and other script libraries to your Visual Studio project, the Package Manager might install a version of the SignalR script file that is more recent than the version shown in this topic. Make sure that the script reference in your code matches the version of the script library installed in your project.

So make sure first that you have the correct versions referenced.

Consider adding the SignalR relevant references to a bundle

public class BundleConfig {
    public static void RegisterBundles(BundleCollection bundles) {
        //... other bundles

        bundles.Add(new ScriptBundle("~/bundles/jquery")
            .Include("~/Scripts/jquery-{version}.js"));        

        bundles.Add(new ScriptBundle("~/bundles/signalr").Include(
            "~/Scripts/jquery.signalr-*", //the * wildcard will get script regardless of version
            "~/signalr/hubs"));

        //Enable minification
        BundleTable.EnableOptimizations = true;
    }
}

//...in start up
BundleConfig.RegisterBundles(BundleTable.Bundles);

and in the view

<!-- javascript: Placed at the end of the document so the pages load faster -->
@Scripts.Render("~/bundles/jquery", "~/bundles/signalr")

From a routing perspective as well you want to make sure when adding to a mixed project that there are no other conflicting routes as the order of when it was added to the middleware pipeline can affect routing to the hub.

For example

public void Configuration(IAppBuilder app) {
    //Auth
    this.ConfigureAuth(app);
    
    //SignalR 
    app.MapSignalR();

    //...other configuration.
}