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

问题

There are two pages: Login.aspx and Profile.aspx, which are built using HTML and AngularJS.

The login.aspx page uses ng-view to get the template of Login-view or Signup View. The code used is:

<head>
    <title></title>
    <base href="/Login.aspx" />
    <link href="StyleSheet/Login_css.css" rel="stylesheet" />
    <script src="JscriptVendors/angular.min.js"></script>
</head>
<body ng-app="JouralApp_login">
    <div ng-view></div>

    <script src="Jscript_Angular/Model.js"></script>
    <script src="Jscript_Angular/Controllers/LoginPageController.js"></script>
    <script src="JscriptVendors/angular-route.min.js"></script>
    <script src="JscriptVendors/angular-animate.min.js"></script>
    <script src="JscriptVendors/jquery.min.js"></script>
</body>

The views are stored in Template folder with the names as: loginTemplate.html, and signupTemplate.html.

The module used for handling the login.aspx page is:

var app_login = angular.module('JouralApp_login', ['ngRoute','ngAnimate']);
var app_profile = angular.module('GameApp', []);

app_login.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) {
    $locationProvider.html5Mode(true);
    $routeProvider
        .when('/login', {
            templateUrl: 'Jscript_Angular/Templates/loginTemplate.html',
            controller: 'loginController'
        })
        .when('/signup', {
            templateUrl: 'Jscript_Angular/Templates/signupTemplate.html'
        }).otherwise({
            redirectTo:'/login'
        })
}]);

Now a created my Profile.aspx, with the HTML code as:

<head>
    <script src="Scripts/angular.js"></script>
</head>
<body ng-app="app_profile">    
    <div ng-controller="chatController">
        <div>
            <div ng-repeat="chat in messages">{{chat}}</div>
            <div>
                <input type="text ng-model="message" />
                <input type="button" ng-click="newMessage()" />
            </div>
        </div>
    </div>
    <script src="Jscript_Angular/Model.js"></script>
    <script src="Scripts/jquery-1.6.4.js"></script>
    <script src="Scripts/jquery.signalR-2.2.0.js"></script>
    <script src="signalr/hub"></script>
    <script src="Jscript_Angular/Controllers/ChatController.js"></script>
</body>

Every thing was working fine until I try to integrate SignalR into my project. I made two classes:

CLASS 1:

[assembly: OwinStartup(typeof(Startup))]

public class Startup
{
    public void Configuration(IAppBuilder app)
    {
        app.MapSignalR();
    }
}

CLASS 2:

public class ChatHub : Hub
{
    public void SendMessage(string name, string message)
    {
        Clients.All.broadcastMessage(name, message);
    }        
}

I also made the following controller in order to access my javascript function:

app_profile.controller('chatController',['$scope', function ($scope) {
    $scope.name = 'Guest';
    $scope.message = '';
    $scope.messages = [];
    $scope.chatHub = null;


    $scope.chatHub = $.connection.chatHub;
    $.connection.hub.start();

    $scope.chatHub.client.broadcastMessage = function (name, message) {
        var newMessage = name + "    " + message;

        $scope.messages.push(newMessage);
        $scope.$apply();
    };
    $scope.newMessage = function () {
        $scope.chatHub.server.sendMessage($scope.name, $scope.message);
        $scope.message = '';
    }
}]);

Now when I try to access my profile page, it show the error

angular.js:13550 Error: SignalR: Error loading hubs. Ensure your hubs reference is correct, e.g. .

Also when i try to access, localhost:5136/signalr/hubs, it redirects me to my login page, i.e: localhost:5136/login

I think the problem is that, it cannot access the hub which I created because of the routing which i did using angularJS for the login page.

Please help me find the solution.

来源：https://stackoverflow.com/questions/37260868/error-loading-hubs-ensure-your-hubs-reference-is-correct-e-g-script-src-si

标签

ASP.NET

angularjs

signalr

angularjs-routing

Error loading hubs. Ensure your hubs reference is correct, e.g. <script src='/signalr/js'></script>

问题