SignalR Client Example

{"id":12025,"library":"signalr","title":"ASP.NET SignalR 2.x JavaScript Client","description":"The `signalr` npm package provides the official JavaScript client for Microsoft's **ASP.NET SignalR 2.x** framework, enabling real-time web functionality such as bi-directional communication between server and client. This client is specifically designed to interact with ASP.NET (full .NET Framework) server applications and is distinct from the newer `ASP.NET Core SignalR` client found under `@microsoft/signalr`. The current stable version is 2.4.3, which primarily includes bug fixes and minor improvements, reflecting its status as a maintenance-mode library. Releases are generally patch-focused with no new features planned. A key characteristic is its reliance on jQuery, functioning as a jQuery plugin to provide its `$.hubConnection` API, and its compatibility with the older ASP.NET runtime environment.","status":"maintenance","version":"2.4.3","language":"javascript","source_language":"en","source_url":"https://github.com/signalr/signalr","tags":["javascript","signalr","microsoft","asp.net","jquery","realtime"],"install":[{"cmd":"npm install signalr","lang":"bash","label":"npm"},{"cmd":"yarn add signalr","lang":"bash","label":"yarn"},{"cmd":"pnpm add signalr","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"The SignalR client is implemented as a jQuery plugin, requiring jQuery to expose its API via `$.hubConnection`.","package":"jquery","optional":false}],"imports":[{"note":"The `signalr` client operates as a jQuery plugin. Ensure jQuery is loaded *before* the SignalR client. In a modern bundler, you might `import 'jquery'` for its side effects, followed by `import 'signalr'`.","wrong":"import { $ } from 'jquery'; // While technically possible, SignalR expects global `jQuery` or `$`","symbol":"jQuery","correct":"import jQuery from 'jquery'; // Or ensure global jQuery is loaded via script tag"},{"note":"After jQuery and the SignalR client script are loaded, the `hubConnection` factory becomes available as a method on the global jQuery object. There is no direct ES module import for `hubConnection` from `signalr`.","wrong":"import { hubConnection } from 'signalr'; // This package is not an ES module with named exports.","symbol":"$.hubConnection","correct":"import 'jquery'; import 'signalr'; // Then `$.hubConnection` is available globally or via `jQuery.hubConnection`"},{"note":"This object is used to access proxies for server-side hubs. It becomes available on the global jQuery object after the SignalR client and the `signalr/hubs` script (auto-generated by the ASP.NET SignalR server) are loaded in the correct order.","wrong":"import { connection } from 'signalr'; // This package is not an ES module with named exports.","symbol":"$.connection","correct":"import 'jquery'; import 'signalr'; // Then ensure /signalr/hubs is loaded; `$.connection` becomes available"}],"quickstart":{"code":"\n\n\n\n SignalR Client Example\n\n\n

\n \n \n\n \n \n \n \n \n \n \n\n \n\n","lang":"javascript","description":"This example demonstrates how to load the SignalR client, establish a connection to an ASP.NET SignalR server, define a client-side method, and invoke a server-side method for basic real-time communication within an HTML page."},"warnings":[{"fix":"For ASP.NET Core applications, use the `@microsoft/signalr` package. For ASP.NET (Full Framework) applications, ensure your server is configured for ASP.NET SignalR 2.x.","message":"This `signalr` package is for the **legacy ASP.NET SignalR 2.x** (targeting .NET Framework) and is NOT compatible with ASP.NET Core SignalR. Attempting to connect this client to an ASP.NET Core SignalR server will fail. The modern client for ASP.NET Core SignalR is found under the `@microsoft/signalr` npm package.","severity":"breaking","affected_versions":">=2.0.0"},{"fix":"Ensure `jQuery` is loaded in your HTML (``) or bundled correctly before `jquery.signalr.js` is loaded. Missing jQuery will result in `TypeError: $(...).hubConnection is not a function`.","message":"This SignalR client requires jQuery to function. It operates as a jQuery plugin, extending the global `jQuery` or `$` object. Loading jQuery is a mandatory prerequisite, and it must be loaded *before* the `jquery.signalr.js` script.","severity":"gotcha","affected_versions":">=2.0.0"},{"fix":"Be aware that minor version increments in this package's history do not always signify new features; always check release notes for actual changes.","message":"The `2.3.0` release incremented the minor version number but explicitly stated it contained 'no new features' and should be considered a 'patch release'. This diverges from standard semantic versioning expectations, where a minor version implies new features.","severity":"gotcha","affected_versions":"2.3.0"},{"fix":"Include `` after loading jQuery and `jquery.signalr.js`. Ensure your ASP.NET SignalR server is running and the `/signalr` route is correctly configured.","message":"To interact with server-side hubs, your application must load the auto-generated `/signalr/hubs` script from your ASP.NET SignalR server. This script provides the client-side proxies for your server's hubs (e.g., `$.connection.myHub`). Without it, `$.connection` will not contain your hub definitions.","severity":"gotcha","affected_versions":">=2.0.0"}],"env_vars":null,"last_verified":"2026-04-19T00:00:00.000Z","next_check":"2026-07-18T00:00:00.000Z","problems":[{"fix":"Ensure jQuery is loaded *before* `jquery.signalr.js` in your HTML or bundler configuration.","cause":"The jQuery SignalR plugin was loaded before jQuery, or jQuery was not loaded at all.","error":"Uncaught TypeError: $(...).hubConnection is not a function"},{"fix":"Verify the `