I am trying to get SignalR running on Angular.
I have achived this before with ReactJs
Looking at several Forum topics and articles I cant really get it to work:
Error Code that i get:
Utils.js:149 [2022-04-24T03:47:55.451Z] Error: Failed to start the connection: Error: Failed to complete negotiation with the server: Error: <!DOCTYPE html>
<pre>Cannot POST /Chat/negotiate</pre>
: Status code '404' Either this is not a SignalR endpoint or there is a proxy blocking the connection.
Code
Program.cs:
//Code...
builder.Services.AddCors(options =>
{
options.AddPolicy(name: "Angular",
builder =>
{
builder.WithOrigins("localhost:44376", "localhost:7231")
.AllowAnyMethod()
.AllowAnyHeader()
.AllowAnyOrigin();
});
});
// Code...
app.MapControllerRoute(
name: "default",
pattern: "{controller}/{action=Index}/{id?}");
app.MapFallbackToFile("index.html"); ;
app.MapHub<ChatHub>("Chat");
app.Run();
ChatHub.cs:
using Microsoft.AspNetCore.SignalR;
namespace DeliveryRestaurant.Hubs
{
public class ChatHub : Hub
{
public async Task SendAll(string message)
{
await Clients.All.SendAsync("ReceiveAllMessage", message);
}
Angular Ts:
ngOnInit(): void {
let connection = new signalR.HubConnectionBuilder()
.withUrl("Chat")
.build();
connection.on("ReceiveAllMessage", data => {
console.log("REceived Data", data);
});
connection.start()
.then(() => connection.invoke("ReceiveAllMessage", "Hello"));
} }