невозможно установить соединение в состоянии «Подключено» в SignalR ASP.NET Core Web API

Question

У меня есть простая серверная часть, где находится мой Hub:

 public class ChatHub : Hub
{
    public async Task Send(string nick, string message)
    {
        await this.Clients.All.SendAsync("Send", nick, message);
    }
}

, который я включаю в Startup.cs:

services.AddSignalR();

app.UseSignalR(routes =>
        {
            routes.MapHub<ChatHub>("/chat");
        });

А вот моя клиентская часть на React, которая должна ссылатьсяна хост:

 class Chat extends Component {
    constructor(props) {
    super(props);

    this.state = {
        nick: '',
        message: '',
        messages: [],
        hubConnection: null,
    };
}

componentDidMount = () => {
    const nick = window.prompt('Your name:', 'John');

    let hubUrl = 'http://localhost:44331/chat';
    const hubConnection = new signalR.HubConnectionBuilder()
        .withUrl(hubUrl)
        .configureLogging(signalR.LogLevel.Information)
        .build();

    this.setState({ hubConnection, nick }, () => {
        this.state.hubConnection
            .start()
            .then(() => console.log('Connection started!'))
            .catch(err => console.log('Error while establishing connection :('));

        this.state.hubConnection.on('Send', (nick, receivedMessage) => {
            const text = `${nick}: ${receivedMessage}`;
            const messages = this.state.messages.concat([text]);
            this.setState({ messages });
        });
    });
};

sendMessage = () => {
    this.state.hubConnection
        .invoke('Send', this.state.nick, this.state.message)
        .catch(err => console.error(err));

    this.setState({ message: '' });
};

render() {
    return (
        <div>
            <br />
            <input
                type="text"
                value={this.state.message}
                onChange={e => this.setState({ message: e.target.value })}
            />

            <button onClick={this.sendMessage}>Send</button>

            <div>
                {this.state.messages.map((message, index) => (
                    <span style={{ display: 'block' }} key={index}> {message} </span>
                ))}
            </div>
        </div>
    );
}
}

Интерфейс рендеринга, но при попытке отправить сообщение на концентратор появляется эта ошибка:

Не удается отправить данные, если соединениеЯ не нахожусь в состоянии «Подключен».

Я новичок в SignalR, поэтому мне очень нужна ваша помощь!