Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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.

like image 880
JianYA Avatar asked Jan 24 '19 06:01

JianYA


People also ask

How do I reconnect my SignalR?

Handle the disconnected event to display a message when an attempt to reconnect has timed out. In this scenario, the only way to re-establish a connection with the server again is to restart the SignalR connection by calling the Start method, which will create a new connection ID.

Does SignalR need SSL?

If your SignalR application transmits sensitive information between the client and server, use SSL for the transport.

Which package is used for SignalR?

SignalR. Client NuGet package contains the . NET client libraries for ASP.NET Core SignalR. Use the HubConnectionBuilder to create and build an instance of a connection to a hub.

What is SignalR in asp net core?

What is SignalR? ASP.NET Core SignalR is an open-source library that simplifies adding real-time web functionality to apps. Real-time web functionality enables server-side code to push content to clients instantly. Good candidates for SignalR: Apps that require high frequency updates from the server.


2 Answers

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

like image 62
TanvirArjel Avatar answered Sep 18 '22 06:09

TanvirArjel


You're using the wrong signalr javascript library. Try https://www.npmjs.com/package/@aspnet/signalr, that's what worked for me.

like image 32
Amy Zheng Avatar answered Sep 20 '22 06:09

Amy Zheng