SignalR、Blazor WebAssembly 应用程序出现问题

Question

I write dynamic application using Blazor WebAssembly. I register service

services.AddSignalR();
services.AddResponseCompression(opts =>
{
     opts.MimeTypes = ResponseCompressionDefaults.MimeTypes.Concat(
     new[] { "application/octet-stream" });
});

Also added endpoints.MapHub<SimpleClientHub>("hubs/simpleclient"); endpoint for hub to routing.

In page Initialization I Add

@page "/accessevent"

@using Microsoft.AspNetCore.SignalR.Client
@using TimeAttendance.WebApp.Shared.Models;
@inject NavigationManager NavigationManager
<button class="btn btn-primary" @onclick="SendStart">Start</button>

<h3>@Name</h3>
<h3>@InternalNumber</h3>

@code {
    public string Name { get; set; } = "";
    public string InternalNumber { get; set; } = "";

    private HubConnection hubConnection;

    protected override async Task OnInitializedAsync()
    {
        hubConnection = new HubConnectionBuilder()
            .WithUrl(NavigationManager.ToAbsoluteUri("hubs/simpleclient"))
            .Build();  

        hubConnection.On<Message>("SendAccessEvent", (message) =>
        {
            Name = message.Name;
            InternalNumber = message.InternalNumber;
            StateHasChanged();
        });
        
        await hubConnection.StartAsync();
    }


    private async Task SendStart()
    {
        await hubConnection.SendAsync("StartListeningAccessEvents");
    }
}

On running the page, I get an error: Am unhandled error has occurred

In dev console:

hubs/simpleclient/negotiate?negotiateVersion=1:1 Failed to load resource: the server responded with a status of 500 ()
blazor.webassembly.js:1 crit: Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100]
      Unhandled exception rendering component: Response status code does not indicate success: 500 (Internal Server Error).
System.Net.Http.HttpRequestException: Response status code does not indicate success: 500 (Internal Server Error).
  at System.Net.Http.HttpResponseMessage.EnsureSuccessStatusCode () <0x313fe00 + 0x00052> in <filename unknown>:0 
  at Microsoft.AspNetCore.Http.Connections.Client.HttpConnection.NegotiateAsync (System.Uri url, System.Net.Http.HttpClient httpClient, Microsoft.Extensions.Logging.ILogger logger, System.Threading.CancellationToken cancellationToken) <0x3095988 + 0x003d6> in <filename unknown>:0 
  at Microsoft.AspNetCore.Http.Connections.Client.HttpConnection.GetNegotiationResponseAsync (System.Uri uri, System.Threading.CancellationToken cancellationToken) <0x30a41a8 + 0x000dc> in <filename unknown>:0 
  at Microsoft.AspNetCore.Http.Connections.Client.HttpConnection.SelectAndStartTransport (Microsoft.AspNetCore.Connections.TransferFormat transferFormat, System.Threading.CancellationToken cancellationToken) <0x30a2630 + 0x0024e> in <filename unknown>:0 
  at Microsoft.AspNetCore.Http.Connections.Client.HttpConnection.StartAsyncCore (Microsoft.AspNetCore.Connections.TransferFormat transferFormat, System.Threading.CancellationToken cancellationToken) <0x30928b0 + 0x001f4> in <filename unknown>:0 
  at System.Threading.Tasks.ForceAsyncAwaiter.GetResult () <0x3157cb0 + 0x00026> in <filename unknown>:0 
  at Microsoft.AspNetCore.Http.Connections.Client.HttpConnection.StartAsync (Microsoft.AspNetCore.Connections.TransferFormat transferFormat, System.Threading.CancellationToken cancellationToken) <0x308ce98 + 0x0010a> in <filename unknown>:0 
  at Microsoft.AspNetCore.Http.Connections.Client.HttpConnectionFactory.ConnectAsync (System.Net.EndPoint endPoint, System.Threading.CancellationToken cancellationToken) <0x3021640 + 0x001be> in <filename unknown>:0 
  at Microsoft.AspNetCore.Http.Connections.Client.HttpConnectionFactory.ConnectAsync (System.Net.EndPoint endPoint, System.Threading.CancellationToken cancellationToken) <0x3021640 + 0x002c8> in <filename unknown>:0 
  at System.Threading.Tasks.ValueTask`1[TResult].get_Result () <0x315c0b8 + 0x00034> in <filename unknown>:0 
  at Microsoft.AspNetCore.SignalR.Client.HubConnection.StartAsyncCore (System.Threading.CancellationToken cancellationToken) <0x301fb50 + 0x00114> in <filename unknown>:0 
  at Microsoft.AspNetCore.SignalR.Client.HubConnection.StartAsyncInner (System.Threading.CancellationToken cancellationToken) <0x2ffcbf0 + 0x002e8> in <filename unknown>:0 
  at System.Threading.Tasks.ForceAsyncAwaiter.GetResult () <0x315e308 + 0x00026> in <filename unknown>:0 
  at Microsoft.AspNetCore.SignalR.Client.HubConnection.StartAsync (System.Threading.CancellationToken cancellationToken) <0x2ffbae0 + 0x0010e> in <filename unknown>:0 
  at TimeAttendance.WebApp.Client.Pages.AccessEvent.OnInitializedAsync () [0x000a2] in C:\Users\Piotr\source\repos\TimeAttendance.WebApp\TimeAttendance.WebApp\Client\Pages\AccessEvent.razor:32 
  at Microsoft.AspNetCore.Components.ComponentBase.RunInitAndSetParametersAsync () <0x2cf6118 + 0x0013a> in <filename unknown>:0 
  at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask (System.Threading.Tasks.Task taskToHandle) <0x2f5bf08 + 0x000b6> in <filename unknown>:0 

The error is caused by line which try to start hubconnection.

Edit: Here is a Hub code:

public class SimpleClientHub : Hub
{

    public async Task StartListeningAccessEvents()
    {
        await Clients.All.SendAsync("SendAccessEvent", 
        new Message { Name = "Piotr", InternalNumber = "InternalNumber"});
    }
}

Answer 1

You can refer to this open source project https://github.com/DaniJG/so-signalr.git

Answer 2

This is the address of his article https://www.dotnetcurry.com/aspnet-core/1480/aspnet-core-vuejs-signalr-app