Hi Folks,
I was working with SignalR and was not able to run the program due the error $.connection.chatHub is undefined, i.e my Hub object was undefined in javascript. Here is how i was able to solve the problem :
I am assuming that you already have got all the files from NuGet command prompt for VS2010 or Have installed aspnetcomponents for VS2012.
If not for VS 2010
Go to nuget command and type
PM> Install-Package Microsoft.AspNet.SignalR -pre
For VS2012
Download the asp.net components installer for VS2012 to get the SignalR template.
Please go step by step
Step 1. Check global.asax file, Make sure you have
<%@ Import Namespace="Microsoft.AspNet.SignalR" %>
<%@ Import Namespace="Microsoft.AspNet.SignalR.Hosting" %>
void Application_Start(object sender, EventArgs e)
{
// Code that runs on application startup
RouteTable.Routes.MapHubs();
}
Step 2. Check the javascript files, The problem might be the old version of javascript files. Please make sure you have
<script src="js/jquery1.8.js" type="text/javascript"></script>
<script src="js/json2.js" type="text/javascript"></script>
<script src="js/jquery.signalR-1.1.2.min.js" type="text/javascript"></script>
<script src='<%: ResolveClientUrl("~/signalr/hubs") %>' type="text/javascript"></script>
make sure that its not <%= ResolveClientUrl("~/signalr/hubs") %> it should be <%: ResolveClientUrl("~/signalr/hubs") %> in the src of the script tag
referencing javascript.
Step 3. Make sure that the Hub class is in App_Code folder, For ex. here the Hub class (i.e ChatHub class) is defined as
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Microsoft.AspNet.SignalR;
using System.Collections.Concurrent;
using System.Threading.Tasks;
using Microsoft.AspNet.SignalR.Hubs;
public class ChatHub : Hub
{
public override Task OnConnected()
{
return base.OnConnected();
}
public override System.Threading.Tasks.Task OnDisconnected()
{
return base.OnDisconnected();
}
public void Send(string message)
{
Clients.All.broadcastMessage(message);
}
public void Send(string message, string ConnectionId)
{
Clients.Client(ConnectionId).addMessage(message);
}
}
Step 4: In my aspx page my SignalR code is
<body>
<script src="js/jquery1.8.js" type="text/javascript"></script>
<script src="js/json2.js" type="text/javascript"></script>
<script src="js/jquery.signalR-1.1.2.min.js" type="text/javascript"></script>
<script src='<%: ResolveClientUrl("~/signalr/hubs") %>' type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
var chat = $.connection.chatHub;
$.connection.hub.start().done(function () {
alert('Connected');
//Send Data to Hub Class
chat.server.send("Welcome to SignalR, SignalR Demo Message From Client");
});
//To get the server message broadcasted
chat.client.addMessage = function (message) {
alert('Message from server '+message);
});
</script>
</body>
And here you go, Run the program and the error would be resolved. Still in case you are getting any problem/error please revert back.
For MVC4
Do the Following :
Step 1. Your Global.asax file should look like
RouteTable.Routes.MapHubs(new HubConfiguration { EnableCrossDomain = true });
BundleConfig.RegisterBundles(BundleTable.Bundles);
RouteConfig.RegisterRoutes(RouteTable.Routes);
i.e RouteTable.Routes.MapHubs(new HubConfiguration { EnableCrossDomain = true }); line should be there before, BundleConfig and RouteConfig.
Step 2. In _Layout.cshtml, After meta tag your code should look like
@Styles.Render("/Content/css")
@Scripts.Render("/bundles/modernizr")
@*@Scripts.Render("/Scripts/jquery-1.8.2.min.js")*@
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("/Scripts/jquery.signalR-1.1.2.min.js")
@Scripts.Render("/signalr/hubs")
<script type="text/javascript">
$(document).ready(function ()
{
var chatHubClient = $.connection.chatHub;
alert(chatHubClient);
$.connection.chatHub.start(function () {
chatHubClient.join('TEST');
});
});
</script>
Please note that i have commented the jquery-1.8.2.min.js as MVC jquery bundle would fulfill the jquery package requirement.
Step 3. Create your Hub Class, Please make sure that its NOT in App_Code folder, otherwise you would receive the error "An item with the same key has already been added.".
Follow these simple steps and you will be able to run the SignalR code in MVC4.
Thanks
Ritesh Tandon
I was working with SignalR and was not able to run the program due the error $.connection.chatHub is undefined, i.e my Hub object was undefined in javascript. Here is how i was able to solve the problem :
I am assuming that you already have got all the files from NuGet command prompt for VS2010 or Have installed aspnetcomponents for VS2012.
If not for VS 2010
Go to nuget command and type
PM> Install-Package Microsoft.AspNet.SignalR -pre
For VS2012
Download the asp.net components installer for VS2012 to get the SignalR template.
Please go step by step
Step 1. Check global.asax file, Make sure you have
<%@ Import Namespace="Microsoft.AspNet.SignalR" %>
<%@ Import Namespace="Microsoft.AspNet.SignalR.Hosting" %>
void Application_Start(object sender, EventArgs e)
{
// Code that runs on application startup
RouteTable.Routes.MapHubs();
}
Step 2. Check the javascript files, The problem might be the old version of javascript files. Please make sure you have
<script src="js/jquery1.8.js" type="text/javascript"></script>
<script src="js/json2.js" type="text/javascript"></script>
<script src="js/jquery.signalR-1.1.2.min.js" type="text/javascript"></script>
<script src='<%: ResolveClientUrl("~/signalr/hubs") %>' type="text/javascript"></script>
make sure that its not <%= ResolveClientUrl("~/signalr/hubs") %> it should be <%: ResolveClientUrl("~/signalr/hubs") %> in the src of the script tag
referencing javascript.
Step 3. Make sure that the Hub class is in App_Code folder, For ex. here the Hub class (i.e ChatHub class) is defined as
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Microsoft.AspNet.SignalR;
using System.Collections.Concurrent;
using System.Threading.Tasks;
using Microsoft.AspNet.SignalR.Hubs;
public class ChatHub : Hub
{
public override Task OnConnected()
{
return base.OnConnected();
}
public override System.Threading.Tasks.Task OnDisconnected()
{
return base.OnDisconnected();
}
public void Send(string message)
{
Clients.All.broadcastMessage(message);
}
public void Send(string message, string ConnectionId)
{
Clients.Client(ConnectionId).addMessage(message);
}
}
Step 4: In my aspx page my SignalR code is
<body>
<script src="js/jquery1.8.js" type="text/javascript"></script>
<script src="js/json2.js" type="text/javascript"></script>
<script src="js/jquery.signalR-1.1.2.min.js" type="text/javascript"></script>
<script src='<%: ResolveClientUrl("~/signalr/hubs") %>' type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
var chat = $.connection.chatHub;
$.connection.hub.start().done(function () {
alert('Connected');
//Send Data to Hub Class
chat.server.send("Welcome to SignalR, SignalR Demo Message From Client");
});
//To get the server message broadcasted
chat.client.addMessage = function (message) {
alert('Message from server '+message);
});
</script>
</body>
And here you go, Run the program and the error would be resolved. Still in case you are getting any problem/error please revert back.
For MVC4
Do the Following :
Step 1. Your Global.asax file should look like
RouteTable.Routes.MapHubs(new HubConfiguration { EnableCrossDomain = true });
BundleConfig.RegisterBundles(BundleTable.Bundles);
RouteConfig.RegisterRoutes(RouteTable.Routes);
i.e RouteTable.Routes.MapHubs(new HubConfiguration { EnableCrossDomain = true }); line should be there before, BundleConfig and RouteConfig.
Step 2. In _Layout.cshtml, After meta tag your code should look like
@Styles.Render("/Content/css")
@Scripts.Render("/bundles/modernizr")
@*@Scripts.Render("/Scripts/jquery-1.8.2.min.js")*@
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("/Scripts/jquery.signalR-1.1.2.min.js")
@Scripts.Render("/signalr/hubs")
<script type="text/javascript">
$(document).ready(function ()
{
var chatHubClient = $.connection.chatHub;
alert(chatHubClient);
$.connection.chatHub.start(function () {
chatHubClient.join('TEST');
});
});
</script>
Please note that i have commented the jquery-1.8.2.min.js as MVC jquery bundle would fulfill the jquery package requirement.
Step 3. Create your Hub Class, Please make sure that its NOT in App_Code folder, otherwise you would receive the error "An item with the same key has already been added.".
Follow these simple steps and you will be able to run the SignalR code in MVC4.
Thanks
Ritesh Tandon
10 comments:
Hi! I am arivazhagan I have follow all the above steps, It will works only Localhost. if i configure
IIS it get error (Chat is undefined)
var chat = $.connection.chatHub;
chat.client.sendMessage = function (message, name) {
//code..
}
Please help me..
Thanks in Advance...
Please send your code so that i can do the needful.
I have a problem with iis6...
is it possible iis6 + windos2003 + VS10(Service pack1)+SignalR
Please post your code.
Hi,
I am trying to add signalr functionaltiy in my asp.net web application for the group chat option.I have created hub class inheriting Hub,refered all the jquery references,added '<%:ResolveClientUrl("~/signalr/hubs")%>'.still getting the error saying that error loading Hubs,please check the hub reference is correct.what is the problem?please help me..I am using vs 2010 sp1 and content page for the group chat embedded in master page
Please provide your complete code so that the needful can be done.
Thank you, Ritesh Tandon. You saved my day.
Glad it helped victor. Thanks.
Shall i post my code???
Post a Comment
Comments are welcome, Please join me on my Linked In account
http://in.linkedin.com/pub/ritesh-tandon/21/644/33b