{"id":32,"date":"2025-06-19T11:08:58","date_gmt":"2025-06-19T11:08:58","guid":{"rendered":"https:\/\/blog.vigplanet.com\/?p=32"},"modified":"2025-10-06T12:42:21","modified_gmt":"2025-10-06T12:42:21","slug":"net-core-signalr-integration-with-example","status":"publish","type":"post","link":"https:\/\/blog.vigplanet.com\/?p=32","title":{"rendered":".NET Core SignalR Integration with Example"},"content":{"rendered":"\n<p>Updated on: May 27, 2025<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">What is SignalR?<\/h2>\n\n\n\n<p><strong>SignalR<\/strong> is a real-time communication library from Microsoft for ASP.NET Core. It allows server-side code to push content to connected clients instantly using WebSockets, Server-Sent Events, or Long Polling as a fallback.<\/p>\n\n\n\n<p>Official documentation: <a href=\"https:\/\/learn.microsoft.com\/en-us\/aspnet\/core\/signalr\/introduction\" target=\"_blank\" rel=\"noreferrer noopener\">SignalR Overview &#8211; Microsoft Docs<\/a><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Why Use SignalR in .NET Core?<\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Real-time updates without polling<\/li>\n\n\n\n<li>Built-in support in .NET Core<\/li>\n\n\n\n<li>Scales well with Azure SignalR Service<\/li>\n\n\n\n<li>Perfect for chat apps, live dashboards, or gaming<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Step-by-Step: SignalR Integration Example in .NET Core<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">1. Create a new ASP.NET Core Project<\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>dotnet new webapp -n SignalRDemo<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">2. Install SignalR NuGet Package<\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>dotnet add package Microsoft.AspNetCore.SignalR<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">3. Create a SignalR Hub<\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>public class ChatHub : Hub\n{\n    public async Task SendMessage(string user, string message)\n    {\n        await Clients.All.SendAsync(\"ReceiveMessage\", user, message);\n    }\n}<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">4. Register SignalR in Startup.cs<\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>\/\/ In Program.cs or Startup.cs depending on your .NET Core version\nbuilder.Services.AddSignalR();\n\napp.MapHub&lt;ChatHub&gt;(\"\/chathub\");<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">5. Add SignalR Client to HTML<\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/microsoft-signalr\/7.0.5\/signalr.min.js\"&gt;&lt;\/script&gt;\n&lt;script&gt;\n    const connection = new signalR.HubConnectionBuilder()\n        .withUrl(\"\/chathub\")\n        .build();\n\n    connection.on(\"ReceiveMessage\", function (user, message) {\n        console.log(user + \": \" + message);\n    });\n\n    connection.start().then(function () {\n        connection.invoke(\"SendMessage\", \"User1\", \"Hello from client!\");\n    });\n&lt;\/script&gt;<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">Bonus: SignalR with Angular or React<\/h2>\n\n\n\n<p>SignalR integrates well with modern JavaScript frameworks. See how to use it with:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/learn.microsoft.com\/en-us\/aspnet\/core\/tutorials\/signalr-typescript-webpack\" target=\"_blank\" rel=\"noreferrer noopener\">SignalR with TypeScript<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/medium.com\/@beardcoding\/how-to-integrate-signalr-with-angular-11-net-core-d91599989c2b\" target=\"_blank\" rel=\"noreferrer noopener\">Angular + SignalR Example<\/a><\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Conclusion<\/h2>\n\n\n\n<p>Integrating SignalR with .NET Core enables seamless real-time communication in your web apps. With minimal setup, you can create chat systems, real-time notifications, and live dashboards. Try it out in your next project!<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">FAQs<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">What protocol does SignalR use?<\/h3>\n\n\n\n<p>SignalR prefers WebSockets and falls back to Server-Sent Events or Long Polling.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Is SignalR free?<\/h3>\n\n\n\n<p>Yes, SignalR is open-source and free to use. Azure SignalR Service has a free tier and paid plans.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Can I use SignalR in Blazor?<\/h3>\n\n\n\n<p>Yes, SignalR is supported in both Blazor Server and Blazor WebAssembly apps.<\/p>\n\n\n\n<p>For more tutorials, visit <a href=\"https:\/\/learn.microsoft.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">Microsoft Learn<\/a> or <a href=\"https:\/\/docs.microsoft.com\/en-us\/aspnet\/core\/\" target=\"_blank\" rel=\"noreferrer noopener\">ASP.NET Core Docs<\/a>.<\/p>\n\n\n\n<p>Written by: <strong>Your Name<\/strong> | <a href=\"https:\/\/yourwebsite.com\" target=\"_blank\" rel=\"noopener\">yourwebsite.com<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Updated on: May 27, 2025 What is SignalR? SignalR is a real-time communication library from Microsoft for ASP.NET Core. It allows server-side code to push content to connected clients instantly using WebSockets, Server-Sent Events, or Long Polling as a fallback. Official documentation: SignalR Overview &#8211; Microsoft Docs Why Use SignalR in .NET Core? Step-by-Step: SignalR<\/p>\n","protected":false},"author":1,"featured_media":72,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4],"tags":[],"class_list":["post-32","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-net-core"],"_links":{"self":[{"href":"https:\/\/blog.vigplanet.com\/index.php?rest_route=\/wp\/v2\/posts\/32","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.vigplanet.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.vigplanet.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.vigplanet.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.vigplanet.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=32"}],"version-history":[{"count":2,"href":"https:\/\/blog.vigplanet.com\/index.php?rest_route=\/wp\/v2\/posts\/32\/revisions"}],"predecessor-version":[{"id":73,"href":"https:\/\/blog.vigplanet.com\/index.php?rest_route=\/wp\/v2\/posts\/32\/revisions\/73"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blog.vigplanet.com\/index.php?rest_route=\/wp\/v2\/media\/72"}],"wp:attachment":[{"href":"https:\/\/blog.vigplanet.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=32"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.vigplanet.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=32"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.vigplanet.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=32"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}