I can get this tutorial to work in a new project, but not in my existing project.
My project is an ASP.Net MVC 4 web application with the following attribute in the web.config file:
<appSettings>
<add key="webpages:Enabled" value="true"/>
</appSettings>
This is because my application is a Single-Page-Application, which uses AngularJS on the client side. The only page in my application is index.cshtml, to which I've added the relevant code for signalR:
<!-- signalR chat -->
<script src="~/Scripts/jquery.signalR-1.0.0.js"></script>
<!--Reference the autogenerated SignalR hub script. -->
<script src="/signalr/hubs"></script>
<!--Add script to update the page and send messages.-->
<script type="text/javascript">
$(function () {
// Declare a proxy to reference the hub.
var chat = $.connection.chatHub;
// Create a function that the hub can call to broadcast messages.
chat.client.broadcastMessage = function (name, message) {
// Html encode display name and message.
var encodedName = $('<div />').text(name).html();
var encodedMsg = $('<div />').text(message).html();
// Add the message to the page.
$('#discussion').append('<li><strong>' + encodedName
+ '</strong>: ' + encodedMsg + '</li>');
};
// Get the user name and store it to prepend to messages.
$('#displayname').val(prompt('Enter your name:', ''));
// Set initial focus to message input box.
$('#message').focus();
// Start the connection.
$.connection.hub.start().done(function () {
$('#sendmessage').click(function () {
// Call the Send method on the hub.
chat.server.send($('#displayname').val(), $('#message').val());
// Clear text box and reset focus for next comment.
$('#message').val('').focus();
});
});
});
</script>
Then I've got the ChatHub.cs file:
public class ChatHub : Hub
{
public void Send(string name, string message)
{
// Call the broadcastMessage method to update clients.
Clients.All.broadcastMessage(name, message);
}
}
And finally in the global.asax:
protected void Application_Start()
{
RouteTable.Routes.MapHubs();
BundleConfig.RegisterBundles(BundleTable.Bundles);
}
When I run the application, the /signalr/hubs file is not generated. I get a 404 when requesting the file, and it crashes on the line:
chat.client.broadcastMessage = function (name, message) { ....
because chat is null as the previous line did not find chatHub:
var chat = $.connection.chatHub;
Does anyone know what's wrong with my code ?
UPDATE
I have solved my problem by changing the line::
<script src="/signalr/hubs"></script>
to
<script src="~/signalr/hubs"></script>
In the default mode, the app server creates five server connections with Azure SignalR Service. The app server uses the Azure SignalR Service SDK by default. In the following performance test results, server connections are increased to 15 (or more for broadcasting and sending a message to a big group).
This error may be seen if the project contains a folder called SignalR, which will interfere with the automatically-created proxy. To avoid this error, do not use a folder called SignalR in your application, or turn automatic proxy generation off.
I have solved my problem by changing the line::
<script src="/signalr/hubs"></script>
to
<script src="~/signalr/hubs"></script>
Also, the reason why /signalr/hubs are not generated is forget to Map SignalR in OWIN Startup Configuration.
public class Startup
{
public void Configuration(IAppBuilder appBuilder){
...
appBuilder.MapSignalR();
...
}
...
In my case, it was because my ChatHub class was not marked public.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With