可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试):

问题:

I admit it, I don't know what I'm doing.

I'm attempting to learn how to use SignalR and I'm following various samples online almost verbatim and I can't get pasted $.connection being undefined. I'm working in MVC 4.0 and trying to use either nuget-downloaded signalR js files or those from sample projects. These are my script references.

@Scripts.Render("~/Scripts/jquery-1.7.2.min.js")
@Scripts.Render("~/Scripts/knockout-2.0.0.js")
@Scripts.Render("~/Scripts/jquery.signalR.js")
@Scripts.Render("~/signalr/hubs")

The scripts seem to load - I've even put alerts at the start of them which fire, but $.connection is always undefined.

In a bizarre turn of events, I have a different project where I'm trying to use a different jQuery library and it uses $. and that object is ALSO always undefined.

I'm just looking for any possible explanation of what I might be doing wrong. Thanks very much in advance.

回答1:

I got the same problem today.

Your answer pointed me in the right direction, because I had the EXACT same setup for script loading.

I had all my script tags on the top of the page (head) in the following order.

JQuery
SignalR
/signalr/hubs
my-script.js

And of course, the @Layout.cshtml was so thoughtful to add @Scripts.Render("~/bundles/jquery") at the bottom of the <body> tag.

Here's what's happening.

In this configuration, when the page loads, it loads up all the scripts in the head tag, in the order they're specified.

so it loads JQuery, then SignalR, which setup $.connection then the auto-generated hubs script which sets up the $.connection.hubName,then the site's custom script.

At this point your custom code runs. BUT your code at some point, waits for the body.onload or document.onReady before accessing the $.connection

By the time this event fires, the script bundle which the Layout template added for you at the end of body tag also downloads and executes. This bundle has the jquery library again.... which resets everything SignalR setup on $ and now your $.connection is not defined anymore.

How to Solve It

Easy fix, make sure you don't load JQuery twice, once before SignalR and once after SignalR. I moved all my scripts to load after the bundle and it fixed the issue. Best practice here is to use the 'scripts' section provided by the template.

@section scripts{
    @*/* load your scripts here. You can exclude jQuery, 
      coz it's already in the template */ *@
}

So this is not a SignalR error at all...

That's 2 hours of my life... I'll never get back ...

Hope This Helps.

回答2:

I solved the problem. I know what I did but I don't know why it worked for sure.

I was referencing the main jquery library (version 1.7.2) at the top of the _Layout.cshtml view, but was not referencing any other jquery scripts. I noticed that by default in the layout view it was loading

@Scripts.Render("~/bundles/jquery")

at the bottom of the view and that a scripts section was located below that.

@RenderSection("scripts", required:false)

I further changed my script references as shown and put my script references shown in the question above inside a

@section scripts
{    
   @Scripts.Render("~/Scripts/jquery.signalR-0.5.1.js")
   @Scripts.Render("~/Scripts/jquery.color.js")
   @Scripts.Render("~/signalr/hubs")
   @Scripts.Render("~/Scripts/blasht.signalr.js")
}

wrapper on my view so that they would be included after the bundles were loaded. I assume that I was not loading all the necessary jquery because now it works.

Now if I can figure out how this applies to my other projects.

回答3:

The reason this works is because of the order in which the javascript files are loaded. If you try and load jquery.signalR-0.5.1.js before loading jquery, then you will face the $.connection undefined because for this to register the jquery should be loaded first. In the _Layout.cshtml template the scripts load in the order

@Scripts.Render("~/bundles/jquery")

@RenderSection("scripts", required: false)

So inside any of your views you can load signalr under the script section and this should work fine.

回答4:

I have had same issue. for me I have included jquery 2 times in page and later in layout. Removed one of them fixed the issue.

Hope it helps

回答5:

This happened to me because I dynamically loaded the ~/signalr/hubs script before loading the jquery.signalR-1.1.4.js script.

When dynamically loading, no error was present, however if I took the output of ~/signalr/hubs and pasted it into my chrome dev tools, I received an error message VM1047:18 Uncaught Error: SignalR: SignalR is not loaded. Please ensure jquery.signalR-x.js is referenced before ~/signalr/hubs. at <anonymous>:18:15 at <anonymous>:300:2