SignalR JavaScript 客户端错误连接到远程 .Net Core Hub答案

【问题标题】：SignalR JavaScript client error in connect to remote .Net Core HubSignalR JavaScript 客户端错误连接到远程 .Net Core Hub
【发布时间】：2020-06-30 08:35:15
【问题描述】：

我正在使用 Asp.Net Core (3) SignalR（最新版本），如此处 https://docs.microsoft.com/en-us/aspnet/core/signalr/javascript-client?view=aspnetcore-3.1 的 Microsoft 教程中所述，但连接集线器时出错。

安装在服务器上的 NuGet 包：

Microsoft.AspNetCore.SignalR(1.1.0)
Microsoft.AspNetCore.SignalR.Core(1.1.0)

我的服务器运行在http://localhost:52852，客户端运行在http://localhost:10843。

我已将客户端 URL 添加为服务器 CORS 策略中可接受的来源。

服务器启动：

// ConfigureServices
    services.AddCors(options => 
        options.AddPolicy("CorsPolicy",
                builder =>
                {
                    builder
                    .AllowAnyMethod()
                    .AllowAnyHeader()
                    .WithOrigins("http://localhost:10843/")
                    .AllowCredentials();
                }));

    services.AddSignalR(hubOptions => {
        hubOptions.EnableDetailedErrors = true;
    });

// App Configure

    app.UseEndpoints(endpoints =>
    {
        endpoints.MapRazorPages();
        endpoints.MapHub<AsteriskHub>("/signalr");
    });

// Hub
    public class MyHub : Hub
    {
        // Some Codes ...
    }

客户端 Javascript：

const connection = new signalR.HubConnectionBuilder()
    .withUrl("http://localhost:52852/signalr")
    .configureLogging(signalR.LogLevel.Information)
    .withAutomaticReconnect()
    .build();

connection.start();

我在 Microsoft 和 Asp.Net 以及 Stackoverflow 帖子中阅读了许多与我的问题类似的文档，但对我出现此错误的原因感到困惑：

访问 XMLHttpRequest 在 'http://localhost:52852/signalr/negotiate?negotiateVersion=1' 来自来源 'http://localhost:10843' 已被 CORS 策略阻止：对预检请求的响应未通过访问控制检查：否请求中存在“Access-Control-Allow-Origin”标头资源。

感谢您的帮助。

【问题讨论】：

标签： c# asp.net-core signalr

【解决方案1】：

.WithOrigins("http://localhost:10843/")

请删除 URL 末尾的斜杠 /，如下所示。

.WithOrigins("http://localhost:10843")

此外，请使用app.UseCors("CorsPolicy") 应用您的 CORS 政策，如下所示。

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
    //... other middleware ...

    app.UseCors("CorsPolicy");

    app.UseRouting();

    //...

    app.UseEndpoints(endpoints =>
    {
        endpoints.MapRazorPages();
        endpoints.MapHub<AsteriskHub>("/signalr");
    });

    //...
}

【讨论】：