AspNetCore SignalR 1.1.0-@ aspnet / signalr在Chrome和EdgeExplorer上有效,但在Firefox上不可用

时间:2019-01-16 12:34:43

标签: c# firefox asp.net-core signalr angular7

问题描述

AspNetCore SignalR 1.1.0-@ aspnet / signalr在Chrome和EdgeExplorer上有效,但在Firefox上不可用。

测试过的浏览器

  • [X] Microsoft EdgeHTML 17.17134->作品
  • [X] Google Chrome版本71.0.3578.98(正式版本)(64位)->工作
  • [] Mozilla Firefox Quantum 64.0.2(64位)->不起作用

软件版本

  • [X] .NET Core API
  • [X] Angular 7.2.0
  • [X] @ aspnet / signalr 1.1.0

对github.com/aspnet链接的疑问:

https://github.com/aspnet/Docs/issues/10441

详细说明:

我正在尝试使用signalr和aspnet Web后端创建实时的angular 7 webapp,但是我注意到firefox无法使用signalR建立连接?有趣的是:Chrome和Edge可以连接并发送和接收数据到集线器。只是不是Firefox ...

如果我查看SocketAPI Project依赖项,可以看到我安装了以下SignalR软件包:

  • Microsoft.AspNetCore.SignalR(1.1.0)
  • Microsoft.AspNetCore.SignalR.Common(1.1.0)
  • Microsoft.AspNetCore.SignalR.Core(1.1.0)
  • Microsoft.AspNetCore.SignalR.Protocols.Json(1.1.0)

如果我查看位于WebClient项目下的package.json,可以看到已安装的@ aspnet / signalr 1.1.0 npm:

{
  "name": "client-app",
  "version": "0.0.0",
  "scripts": {
    ...
  },
  "private": true,
  "dependencies": {
    ...
    "@aspnet/signalr": "^1.1.0",
    ...
  },
  "devDependencies": {
    ...
  }
}

服务器配置

我已经在SocketAPI Startup.cs 上设置了cors,如下所示:

在我的 ConfigureServices方法 中,我有以下代码:

// This method gets called by the runtime. Use this method to add services to the container.
public void ConfigureServices(IServiceCollection services)
{
    services.Configure<MvcOptions>(options =>
    {
        options.Filters.Add(new RequireHttpsAttribute());

    });

    //*************************
    // Setup CORS For SignalR *
    //*************************
    services.AddCors(options => options.AddPolicy("CorsPolicy", builder =>
    {
        builder
        .WithOrigins(Configuration.GetSection("URIs").GetValue<string>("CLIENT_URL")) // Only allow adress of BHR.WebClient
        .AllowAnyMethod()
        .AllowAnyHeader()
        .AllowCredentials();
    }));

    services.AddSignalR();

    services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_2_2);
}

在我的 配置方法

public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{

    if (env.IsDevelopment())
    {
        app.UseDeveloperExceptionPage();
    }
    else
    {
        // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
        app.UseHsts();
    }

    app.UseCors("CorsPolicy");

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

    app.UseHttpsRedirection();
    app.UseMvc();

}

我还创建了一个 AppHub 类,如下所示:

public class AppHub : Hub
{
    public void SendToAll(string name, string message)
    {
        Clients.All.SendAsync("sendToAll", name, message);
    }
    public override async Task OnConnectedAsync()
    {
        Console.Write(Context.ConnectionId+" Connected");
        //await Groups.AddToGroupAsync(Context.ConnectionId, "SignalR Users");
        await base.OnConnectedAsync();
    }
    public override async Task OnDisconnectedAsync(Exception exception)
    {
        Console.Write(Context.ConnectionId + " Disonnected");
        //await Groups.RemoveFromGroupAsync(Context.ConnectionId, "SignalR Users");
        await base.OnDisconnectedAsync(exception);
    }
}

客户端配置

在客户端,我有一个 HubService

import { Injectable, EventEmitter, Inject } from '@angular/core';
import { HubConnection, HubConnectionBuilder } from '@aspnet/signalr';
import * as signalR from '@aspnet/signalr';

@Injectable({
  providedIn: 'root'
})
export class HubService {

  constructor(
    @Inject('SAPI_URL') private sapiUrl: string
  ) { }

  hubConnections: Map<string, HubConnection> = new Map<string, HubConnection>();

  OnReceive: EventEmitter<any> = new EventEmitter<any>();

  // this.Connect();

  BuildHub(name: string = "AppHub", url: string = "app"): HubConnection {

    this.hubConnections.set(name, new HubConnectionBuilder()
      .withUrl(this.sapiUrl + "/" + url, {
        skipNegotiation: true,
        transport: signalR.HttpTransportType.WebSockets
      })
      //.configureLogging(signalR.LogLevel.Information)
      //.configureLogging(signalR.LogLevel.Debug)
      .build());
    return this.hubConnections.get(name);
  }

}

HomeComponent

会调用以下“ InitHubConnection”方法
InitHubConnection(): any {
  let hubConnection: HubConnection = this.hubService.BuildHub();
  console.log(hubConnection);
  this.Connect();

}
Connect() {
  this.hubService.hubConnections.get('AppHub')
    .start()
    .then(() => {
      console.log('Connection started!');
      this.hubService.hubConnections.get('AppHub').send("sendToAll", "John", "Doe");
    })
    .catch(err => {
      console.log('Error while establishing connection :(')
      //this.Connect(); Try reconnect
    });
  this.hubService.hubConnections.get('AppHub').on('sendToAll', (...args: any[]) => {
    console.log(args);
  })
}

现在,如果我在Chrome和Edge上进行了测试,那么它可以工作,但是如果我尝试连接到Firefox,则在Firefox中会出现以下错误:

**Firefox can't establish a connection to the server at wss://localhost:44336/app. WebSocketTransport.js:85
[2019-01-16T12:26:53.183Z] Error: Failed to start the connection: null**

我还搜索了MS文档,发现了这一点:

来源:https://docs.microsoft.com/en-us/aspnet/signalr/overview/testing-and-debugging/troubleshooting#firefox-cant-establish-a-connection-to-the-server-at-address-error-in-firebug

但是不幸的是,此故障排除方法没有给出解决方案的提示,所以我希望我可以向大家询问这个错误...它已经使我发疯,因为它似乎可以在Chrome和Edge上使用...只是没有Firefox ...

对此有任何帮助,深表感谢!

dotnet-信息输出关于VS信息

PM> dotnet --info output
.NET Core SDK (gemäß "global.json"):
 Version:   2.2.100
 Commit:    b9f2fa0ca8

Laufzeitumgebung:
 OS Name:     Windows
 OS Version:  10.0.17134
 OS Platform: Windows
 RID:         win10-x64
 Base Path:   C:\Program Files\dotnet\sdk\2.2.100\

Host (useful for support):
  Version: 2.2.0
  Commit:  1249f08fed

.NET Core SDKs installed:
  1.1.8 [C:\Program Files\dotnet\sdk]
  1.1.9 [C:\Program Files\dotnet\sdk]
  1.1.11 [C:\Program Files\dotnet\sdk]
  2.1.103 [C:\Program Files\dotnet\sdk]
  2.1.104 [C:\Program Files\dotnet\sdk]
  2.1.200 [C:\Program Files\dotnet\sdk]
  2.1.201 [C:\Program Files\dotnet\sdk]
  2.1.202 [C:\Program Files\dotnet\sdk]
  2.1.403 [C:\Program Files\dotnet\sdk]
  2.1.500 [C:\Program Files\dotnet\sdk]
  2.1.503 [C:\Program Files\dotnet\sdk]
  2.2.100 [C:\Program Files\dotnet\sdk]

.NET Core runtimes installed:
  Microsoft.AspNetCore.All 2.1.5 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.All]
  Microsoft.AspNetCore.All 2.1.6 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.All]
  Microsoft.AspNetCore.All 2.1.7 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.All]
  Microsoft.AspNetCore.All 2.2.0 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.All]
  Microsoft.AspNetCore.App 2.1.5 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 2.1.6 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 2.1.7 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 2.2.0 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.NETCore.App 1.0.10 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 1.0.11 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 1.0.13 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 1.1.7 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 1.1.8 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 1.1.10 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.0.6 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.0.7 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.0.9 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.1.5 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.1.6 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.1.7 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.2.0 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App]

To install additional .NET Core runtimes or SDKs:
  https://aka.ms/dotnet-download

1 个答案:

答案 0 :(得分:0)

解决方案

看来我让调试器弄乱了套接字...

下面是两个带有正确和错误大小写图像的链接:

WRONG -> I had the Settings set to Chrome and without script debugger

CORRECT -> The Settings like this resolved the error and all browsers were capable of Communicating with eachother

我希望这可以帮助其他人解决同样的问题!

亲切问候