SignalR

https://www.npmjs.com/package/@microsoft/signalr

Installation

npm install @microsoft/signalr
# or
yarn add @microsoft/signalr

Usage

Create a connection

// create the connection instance
let connection = new signalR.HubConnectionBuilder()
  .withUrl("https://example.com/signalr/chat")
  .build()
  • Starts the connection.
connection.start()
  • Stops the connection.
connection.stop()

Call hub methods from client

Using ie the javascript client I can either use

connection.invoke("SendMessage", user, message)

or

connection.send("Send", message)

You need to read the source code to see the difference between send and invoke.

  • Send returns a promise that is resolved when the client has sent the invocation to the server, or an error occurred. The server may still be handling the invocation when the promise resolves.
  • Invoke returns a promise that is resolved when the server has finished invoking the method (or an error occurred). In addition, the Invoke promise can receive a result from the server method, if the server returns a result.

The code can be found here

Call client methods from hub

As a best practice, call the start method on the HubConnection after on. Doing so ensures your handlers are registered before any messages are received.

To receive messages from the hub, define a method using the on method of the HubConnection.

  • The name of the JavaScript client method. In the following example, the method name is ReceiveMessage.
  • Arguments the hub passes to the method. In the following example, the argument value is message.
connection.on("ReceiveMessage", (user, message) => {
  // do something
})

Error handling and logging.

connection.start().catch((err) => console.error(err))

Set up client-side log tracing by passing a logger and type of event to log when the connection is made. Messages are logged with the specified log level and higher. Available log levels are as follows:

  • signalR.LogLevel.Error: Error messages. Logs Error messages only.
  • signalR.LogLevel.Warning: Warning messages about potential errors. Logs Warning, and Error messages.
  • signalR.LogLevel.Information: Status messages without errors. Logs Information, Warning, and Error messages.
  • signalR.LogLevel.Trace: Trace messages. Logs everything, including data transported between hub and client.

Use the configureLogging method on HubConnectionBuilder to configure the log level. Messages are logged to the browser console.

Reconnect clients

After to 3.0, the JavaScript client for SignalR automatically reconnect with using withAutomaticReconnect. You don't must write code that will reconnect your client manually.

For example

  1. Create a connection
import * as signalR from '@microsoft/signalr';

// Connect, using the token we got.
  let connection = new signalR.HubConnectionBuilder()
    .withUrl(connectionHub, options),
      {
        transport:
          signalR.HttpTransportType.WebSockets ||
          signalR.HttpTransportType.LongPolling,
        accessTokenFactory: () => globalState.token,
      },
    )
    .configureLogging(signalR.LogLevel.Warning)
    .withAutomaticReconnect() //will automatically try to reconnect
    .build();
  1. Send
await connection.send(
  HUB_SEND,
  globalState.user.endUserProfiles[0].id.toString(), // endUserProfileId
  entity, //name entity send to signalr
  JSON.stringify(data)
)
  1. Receive
connection.on(HUB_RECEIVE, (entity, data) => {
  const list = JSON.parse(data)
  switch (
    entity
    // TODO
  ) {
  }
})