首页 > 解决方案 > 未触发 SignalR Javascript 客户端回调

问题描述

我能够连接到我的集线器,并且连接了 OnConnected 和 OnDisconnected。他们应该从一个整数中加/减,并使用新值调用客户端回调。我的 Angular 应用程序已成功连接到服务器,但未触发我注册的回调函数。

这是我的服务器集线器:

[HubName("online")]
public class OnlineHub : Hub
{
    private static int userCount = 0;

    public override Task OnConnected()
    {
        userCount++;
        Clients.All.listUpdated(userCount);

        return base.OnConnected();
    }

    public override Task OnDisconnected(bool stopCalled)
    {

        userCount--;

        Clients.All.listUpdated(userCount);

        return base.OnDisconnected(stopCalled);
    }
}

这是我的 Angular SignalRService:

import { AppSettings } from './../app.settings';
import { EventEmitter, Injectable, OnDestroy } from '@angular/core';

declare const $: any;

@Injectable()
export class SignalRService {

  // Declare the variables
  private onlineHub: any;
  // create the Event Emitter
  public messageReceived: EventEmitter<any>;
  public connectionEstablished: EventEmitter<Boolean>;
  public connectionExists: Boolean;

  constructor(private appSettings: AppSettings) {
    // Setup
    this.connectionEstablished = new EventEmitter<Boolean>();
    this.messageReceived = new EventEmitter<any>();
    this.connectionExists = false;
  }

  // This method gets executed from angular controller
  public initialize(proxyName: string): void {
    this.onlineHub = $.connection.online;

    this.onlineHub.client.listUpdated = function(list: any): void {
      console.log(list);
      this.messageReceived.emit(list);
    };

    this.startConnection();
  }

  private startConnection(): void {
    $.connection.hub.url = this.appSettings.SIGNALR_BASE_URL + '/signalr';
    $.connection.hub.start()
      .done((data: any) => {
        console.log('SignalR Connected with: ' + data.transport.name);
        this.connectionEstablished.emit(true);
        this.connectionExists = true;
      })
      .fail((error: any) => {
        console.log('SignalR could not connect: ' + error);
        this.connectionEstablished.emit(false);
      });
  }

  private registerOnServerEvents() {
    this.onlineHub.client.listUpdated = function(list: any): void {
      console.log(list);
      this.messageReceived.emit(list);
    };
  }
}

如文档所述,我在运行 start() 之前注册了回调“listUpdated”,并且 $.connection.hub 在调用 start() 之前包含 client.listUpdated,因此它应该注册。但是,仍然没有调用 OnConnected 方法。

标签: javascriptasp.netangularsignalr

解决方案


我通过在 try/catch 块中包围 OnConnected() 和 OnDisconnected() 代码解决了这个问题,并创建了一个名为“error”的客户端方法,该方法将最终异常返回给客户端。这样我发现我有一个 Json 序列化问题。

我的 Hub 现在看起来像这样:

    [HubName("online")]
    public class OnlineHub : Hub
    {
        private static int userCount = 0;


        public override Task OnConnected()
        {
            try
            {
                userCount++;
                Clients.All.listUpdated(userCount);

            }
            catch (Exception exc)
            {
                Clients.All.error(exc);
            }

            return base.OnConnected();
        }

        public override Task OnDisconnected(bool stopCalled)
        {
            try
            {
                userCount--;
                Clients.All.listUpdated(userCount);
            }
            catch (Exception exc)
            {
                Clients.All.error(exc);
            }

            return base.OnDisconnected(stopCalled);
        }
    }

在调用 start() 之前,我在 js 客户端上注册了错误回调:

this.onlineHub.client.error = (exc: any): void => {
  console.log('Error occured:', exc);
};

推荐阅读