Search code examples
javascriptjqueryasp.netasp.net-coresignalr

ASP.NET Core 2.1 SignalR is not defined


This is my chat javascript

"use strict";

var connection = new signalR.HubConnectionBuilder().withUrl("/chathub").build();

connection.on("ReceiveMessage", function (message) {
    var msg = message.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
    var encodedMsg = msg;
    var li = document.createElement("li");
    li.textContent = encodedMsg;
    document.getElementById("Messages").appendChild(li);
});

connection.start().catch(function (err) {
    return console.error(err.toString());
});

document.getElementById("Send").addEventListener("click", function (event) {
    var message = document.getElementById("Message").value;
    connection.invoke("SendMessage", message).catch(function (err) {
        return console.error(err.toString());
    });
    event.preventDefault();
});

This is the error I get when I run the page with my chat input:

Uncaught ReferenceError: signalR is not defined at chat.js:3

line 3 in chat.js is:

var connection = new signalR.HubConnectionBuilder().withUrl("/chathub").build();

I downloaded the SignalR client library from Visual Studio Add Client Side Library. What I have now is a file called jquery.signalR.js and it is the ASP.NET SignalR Javascript Library 2.4.0.

However, this error doesn't go away and I am unable to proceed for some reason.


Solution

  • I see your application is ASP.NET Core but you are using jquery.signalR.js which is actually for ASP.NET MVC. SignalR client for ASP.NET Core is signalr.js which is independent of jQuery. You can download the signalr.js for ASP.NET Core from NPM:

    You can also download using Visual Studio Client Side Library Manager (LibMan) as follows:

    • In Solution Explorer, right-click on the project, and select Add > Client-Side Library.

    • In the Add Client-Side Library dialog, for Provider select unpkg.

    • For Library, enter @microsoft/signalr@latest, and select the latest version
      that isn't preview.

    • Must change Target Location to wwwroot/lib/signalr if it is anything else containing @ in the path. Otherwise it would not download.

    enter image description here

    For more details: Getting started with ASP.NET Core SignalR