协商请求期间出现 Angular SignalR 错误答案

【问题标题】：Angular SignalR Error during negotiation request协商请求期间出现 Angular SignalR 错误
【发布时间】：2018-04-18 16:35:45
【问题描述】：

我们正在尝试将 SignalR 与 Angular 2 和 TypeScript 一起使用。看来我的客户端代码不起作用，尤其是建立连接（没有生成的代理）

我关注了Angular 2 TypeScript using SignalR，但我没有包含 SignalR/Hubs 脚本路径，因为我没有看到自动生成的代理，因为我没有看到为我创建的任何自动生成的代理类。也参考SignalR documentation使用Javascript编写代码

我们使用 windows 身份验证和 Visual Studio 2015、Windows 7、IIS Express

我收到这个错误

协商请求期间出错。

中心类

public class ServerRefreshHub : Hub
{    
    public ServerRefreshHub()
    {

    }        

    public override Task OnConnected()
    {
     //It seems hub is not connected as client code fails
    }

    public static void NotifyUsers()
    {
    IHubContext context = GlobalHost.ConnectionManager.GetHubContext<ServerRefreshHub>();
    context.Clients.All.MessageFromServer("Hello");
    }
}

Asp.Net WebAPI 启动

public partial class Startup
{
    public void Configuration(IAppBuilder app)
    {
        app.Map(
                "/signalr",
                map =>
                {
                    var hubConfiguration = new HubConfiguration { 
                                    EnableDetailedErrors = true };
                    map.RunSignalR(hubConfiguration);
                });
   }
}

角度代码

declare var $: any;

@Injectable()
export class ServerNotifier {
    private connection: any;        
    private proxy: any;

    constructor() {

        this.connection = $.hubConnection();
        this.proxy = this.connection.createHubProxy('userCacheRefreshHub');
        this.proxy.on('MessageFromServer', (message: string) => 
                                  this.onMessageFromServer(message));

         this.connection.start().done((data: any) => {  
        console.log('Now connected ' + data.transport.name + ', connection ID= ' + data.id);  
         }).fail((error: any) => {  
         console.log('Could not connect ' + error);  
    });  
    }

    private onMessageFromServer(message: string) {

    }
}

Package.Json

"@types/jquery": "2.0.47",
"@types/signalr": "^2.2.35",
"signalr": "^2.2.2"

注意：

"@types/jquery": "^3.2.16" 将 typescript 更新到最新和我开始遇到更多问题，所以我降级只是为了打字只有

在控制台中我看到 200 此请求的 URL 的响应代码 http://localhost:58965/signalr/negotiate?clientProtocol=1.5&connectionData=%5B%7B%22name%22%3A%22serverrefreshhub%22%7D%5D&_=1509976299819

【问题讨论】：

标签： angular typescript asp.net-web-api signalr signalr-2

【解决方案1】：

SignalR 不会为您生成代理类。

您只需使用 MapSignalR() 配置 SignalR：

    public void Configuration(IAppBuilder app)
    {
        var config = new HttpConfiguration();

        var settings = new JsonSerializerSettings();
        settings.ContractResolver = new SignalRContractResolver();
        var serializer = JsonSerializer.Create(settings);
        GlobalHost.DependencyResolver.Register(typeof(JsonSerializer), () => serializer);

        app.UseCors(CorsOptions.AllowAll);
        app.MapSignalR();
    }

在您的集线器类上方添加 HubName 属性：

[HubName("ServerRefreshHub")]
public class ServerRefreshHub : Hub

不要忘记在声明 hubConnection 时指定您的 hubConnection url，并在创建代理时指定您的 hubName。

this.connection = $.hubConnection();
this.connection.url = "http://localhost:58965/signalr";
this.proxy = this.connection.createHubProxy('ServerRefreshHub');

【讨论】：