Erro ao carregar os hubs. Verifique se a referência de hubs está correta, por exemplo, <script src = '/ signalr / js'> </script>

Question

May 16, 2016, 08:34 PM

c#asp.net angularjs-routing signalr angularjs

Erro ao carregar os hubs. Verifique se a referência de hubs está correta, por exemplo, <script src = '/ signalr / js'> </script>

Existem duas páginas: Login.aspx e Profile.aspx, criadas usando HTML e AngularJS.

A página login.aspx usa a ng-view para obter o modelo de Login-view ou Signup View. O código usado é:

<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>

As visualizações são armazenadas na pasta Modelo com os nomes como: loginTemplate.html e signupTemplate.html.

O módulo usado para manipular a página login.aspx é:

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'
        })
}]);

Agora, criei meu Profile.aspx, com o código HTML como:

<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>

Tudo funcionou bem até eu tentar integrar o SignalR ao meu projeto. Eu fiz duas aulas:

CLASSE 1:

[assembly: OwinStartup(typeof(Startup))]

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

CLASSE 2:

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

Também fiz o seguinte controlador para acessar minha função javascript:

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 = '';
    }
}]);

Agora, quando tento acessar minha página de perfil, ela mostra o erro

angular.js: 13550 Erro: SignalR: Erro ao carregar hubs. Verifique se a referência de hubs está correta, por exemplo, .

Além disso, quando tento acessar,localhost: 5136 / signalr / hubs, istoredireciona para a minha página de login, ou seja:localhost: 5136 / login

Acho que o problema é que, ele não pode acessar o hub que criei devido ao roteamento que fiz usando angularJS para a página de login.

Por favor me ajude a encontrar a solução.