Angular 5客户端无法连接SignalR Core Hub问题求助

看起来你遇到的是典型的CORS配置冲突加上版本不匹配的问题，我来一步步帮你排查解决：

1. 修复CORS配置的核心冲突 #

你当前的CORS配置里同时用了AllowAnyOrigin()和AllowCredentials()，这是浏览器安全策略不允许的——当允许携带凭证（比如Cookie、Token）时，不能开放给任意源，必须明确指定允许的前端地址。

修改Startup.cs里的CORS配置，把AllowAnyOrigin()替换成你的Angular应用实际运行的地址（比如默认的http://localhost:4200）：

services.AddCors(options => {
    options.AddPolicy( "CorsPolicy", builder => builder
        .WithOrigins("http://localhost:4200") // 替换成你的Angular真实地址，多个源用逗号分隔
        .AllowAnyHeader()
        .AllowAnyMethod()
        .AllowCredentials()
    );
});

2. 确保SignalR服务端与客户端版本匹配 #

.NET Core 2.0对应的SignalR Core还处于预览阶段，你用的@aspnet/signalr-client包已经被重命名，且版本必须和服务端严格对应：

• 先检查服务端NuGet包：确保Microsoft.AspNetCore.SignalR的版本是1.0.0-preview2-final（和.NET Core 2.0兼容的唯一版本）
• 更新Angular客户端包：

  npm uninstall @aspnet/signalr-client
  npm install @aspnet/signalr@1.0.0-preview2-final --save
  

• 修正Angular代码里的导入语句：

  import { HubConnection } from '@aspnet/signalr'; // 去掉-client后缀
  

3. 修正Angular客户端的连接代码 #

你的代码里有语法错误和小问题，调整后如下：

initHub() {
    const signalrBaseUri = "https://localhost:44301/hubs/sample";
    this.hubConnection = new HubConnection(signalrBaseUri);

    // 先注册消息监听，再启动连接
    this.hubConnection.on('receiveMessage', (receivedMessage: SampleMessage) => {
        console.log("Message received : ");
        console.log(receivedMessage); // 修正了之前的变量名错误
    });

    this.hubConnection
        .start({ withCredentials: true }) // 显式开启凭证携带，和服务端配置对应
        .then(() => {
            console.log('连接成功！');
            return this.hubConnection.invoke("Subscribe", this.groupName);
        })
        .catch(err => {
            console.log('建立连接时出错 :(');
            console.error(err);
        });
}

这里做了几个关键调整：

• 把消息监听on放在start之前，确保连接建立后能立即接收消息
• 修正了变量名错误（sampleMessage改为receivedMessage）
• 显式添加withCredentials: true，确保凭证能正确发送到服务端

4. 验证中间件顺序 #

你当前的Configure方法顺序是正确的：UseCors必须在UseSignalR和UseMvc之前，这样CORS规则才能覆盖所有请求（包括SignalR的OPTIONS预检请求），这点不用改。

5. 开启详细日志排查 #

如果还是有问题，可以在Program.cs里开启详细日志，查看Kestrel对OPTIONS请求的处理细节：

public static IWebHost BuildWebHost(string[] args) =>
    WebHost.CreateDefaultBuilder(args)
        .ConfigureLogging(logging =>
        {
            logging.AddConsole();
            logging.SetMinimumLevel(LogLevel.Debug);
        })
        .UseStartup<Startup>()
        .Build();

这样控制台会输出每个请求的处理过程，帮你确认CORS规则是否生效。

按上面的步骤调整后，应该就能解决405错误，成功建立SignalR连接了。

内容的提问来源于stack exchange，提问作者pieperu