Angular 5客户端获取SignalR连接ID返回undefined问题求助

看起来你遇到的核心问题是在start()的.done回调里拿不到正确的连接ID，大概率是上下文绑定的问题，我来帮你一步步排查和解决：

最常见的原因：回调里的this指向不对 #

在普通的function回调中，this的指向会变成调用该回调的对象（这里是jQuery的Deferred实例），而不是你的类实例，所以你访问的this.connection根本不是你之前创建的那个SignalR连接对象，自然id就是undefined。

修复方案1：用箭头函数保留上下文 #

ES6的箭头函数会继承外层的this指向，直接把.done的回调改成箭头函数就能解决：

public startConnection(): void { 
  this.connection = $.hubConnection('http://localhost:62752'); 
  this.proxy = this.connection.createHubProxy('ChatHub'); 
  // 这里你已经用了箭头函数，保持这个写法很好
  this.proxy.on('messageReceived', (a,b,c,d,e,f) => this.onMessageReceived(a,b,c,d,e,f)); 

  this.connection.start()
    .done(() => {
      // 箭头函数让this指向当前类实例
      const connectionId = this.connection.id;
      console.log('连接成功，ID:', connectionId);
      // 现在这里能正确拿到连接ID了
    })
    .fail(error => {
      console.error('连接失败，错误信息:', error);
    });
}

修复方案2：提前保存实例引用（兼容ES5） #

如果你的环境不支持ES6箭头函数，可以在回调外先把当前实例的引用存起来：

public startConnection(): void { 
  const self = this; // 保存当前类的实例引用
  this.connection = $.hubConnection('http://localhost:62752'); 
  this.proxy = this.connection.createHubProxy('ChatHub'); 

  this.proxy.on('messageReceived', function(a,b,c,d,e,f) { 
    self.onMessageReceived(a,b,c,d,e,f); 
  }); 

  this.connection.start()
    .done(function() {
      // 用self访问类实例的connection
      const connectionId = self.connection.id;
      console.log('连接成功，ID:', connectionId);
    })
    .fail(function(error) {
      console.error('连接失败，错误信息:', error);
    });
}

其他需要排查的点 #

1. 确认SignalR版本匹配：

   • 旧版ASP.NET SignalR（基于System.Web）的连接ID是connection.id
   • ASP.NET Core SignalR的连接ID是connection.connectionId
     别搞混了！

2. 检查连接是否真的成功：
   有时候看起来.done回调执行了，但实际连接可能因为跨域、Hub地址错误等问题没有真正建立，此时connection.id也会是undefined。可以在.fail回调里打印错误信息，确认连接是否正常。

3. 不要在start()之前获取ID：
   连接ID是在服务器端成功建立连接后才返回给客户端的，只有在start()的.done（或Promise的then）回调里，才能拿到有效的ID。

内容的提问来源于stack exchange，提问作者Ori V Agmon