简体   繁体   English

无法将在端口上运行的 SignalR 客户端连接到 .NET Core 2.2 服务器

[英]Cannot connect SignalR client running on a port to a .NET Core 2.2 server

I have a .NET Core 2.2 server running locally on http://localhost:5002 and a client (mostly copy/pasted from Microsoft's docs ) running on http://localhost:5000 .我有一个在http://localhost:5002上本地运行的 .NET Core 2.2 服务器和一个在http://localhost:5000上运行的客户端(主要是从Microsoft 的文档中复制/粘贴)。

On the server side I have the sample hub from the docs, just renamed to TestHub , and the following bits in Startup.cs :在服务器端,我有来自文档的示例集线器,刚刚重命名为TestHub ,以及Startup.cs的以下位:

public void ConfigureServices(IServiceCollection services)
{
    ...
    services.AddSignalR(options => { options.EnableDetailedErrors = true; });
    services.AddCors();
    services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_2_2);
}

public void Configure(IApplicationBuilder app)
{
    ...

    app.UsePathBase("/custom");
    app.UseSignalR(routes => 
    {
        routes.MapHub<TestHub>("/test");
    });
    app.UseCors(options => options
        .AllowAnyHeader()
        .AllowAnyMethod()
        .WithOrigins("http://localhost:5000")
        .AllowCredentials());
    app.UseMvc();
}

The CORS config was adapted from this GitHub issue . CORS 配置改编自此 GitHub 问题

On the client side I installed the @microsoft/signalr package using the instructions from the docs, then slightly changed the chat.js file to use the server's url.在客户端,我使用文档中的说明安装了@microsoft/signalr包,然后稍微更改了chat.js文件以使用服务器的 url。

"use strict";

// This is the only line I changed
var connection = new signalR.HubConnectionBuilder().withUrl("http://localhost:5002/test").build();

//Disable send button until connection is established
document.getElementById("sendButton").disabled = true;

connection.on("ReceiveMessage", function (user, message) {
    ...
});

connection.start().then(function () {
    document.getElementById("sendButton").disabled = false;
}).catch(function (err) {
    return console.error(err.toString());
});

document.getElementById("sendButton").addEventListener("click", function (event) {
    ...
});

I tried both http://localhost:5002/test and http://localhost:5002/custom/test , but nothing works.我尝试了http://localhost:5002/testhttp://localhost:5002/custom/test ,但没有任何效果。 Chrome just says net::ERR_FAILED , while Firefox reports a 405 response for an OPTIONS call to http://localhost:5002/test/negotiate?negotiateVersion=1 . Chrome 只是说net::ERR_FAILED ,而 Firefox 报告405响应对http://localhost:5002/test/negotiate?negotiateVersion=1OPTIONS调用。 Both browsers, however, warn that not Access-Control-Allow-Origin header is present, which is odd since I was expecting the CORS config to take care of it.但是,两个浏览器都警告说不存在Access-Control-Allow-Origin标头,这很奇怪,因为我希望 CORS 配置能够处理它。

Try using AddCors and Addpolicy from your ConfigureServices method instead.尝试使用 ConfigureServices 方法中的 AddCors 和 Addpolicy。 That solved the issue for me.那为我解决了这个问题。

In ConfigureServices method add :在 ConfigureServices 方法中添加:

services.AddCors(options =>
        {
            options.AddPolicy("AllowOrigin", builder =>
            builder.WithOrigins(new[] {"http://localhost:5000", "https://localhost:5000"})
            .AllowAnyHeader()
            .AllowAnyMethod()
            .AllowCredentials()
            .SetIsOriginAllowed((host) => true) //for signalr cors  
            );

And then first in Configure method add :然后首先在 Configure 方法中添加:

app.UseCors("AllowOrigin");

In the end I set the CORS config before all other middleware in the pipeline (such as AddSignalR ) and it finally worked.最后,我在管道中的所有其他中间件(例如AddSignalR之前设置了 CORS 配置,它终于起作用了。

public void Configure(IApplicationBuilder app)
{
    app.UseCors(...);

    // Everything else
}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM