无法将端口上的 SignalR 客户端 运行 连接到 .NET Core 2.2 服务器
Cannot connect SignalR client running on a port to a .NET Core 2.2 server
我在 http://localhost:5002
本地有一个 .NET Core 2.2 服务器 运行,在 http://localhost:5000
.
在服务器端,我有文档中的示例集线器,刚刚重命名为 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();
}
CORS 配置改编自 this GitHub issue。
在客户端,我使用文档中的说明安装了 @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) {
...
});
我尝试了 http://localhost:5002/test
和 http://localhost:5002/custom/test
,但没有任何效果。 Chrome 只是说 net::ERR_FAILED
,而 Firefox 报告对 http://localhost:5002/test/negotiate?negotiateVersion=1
的 OPTIONS
调用的 405
响应。然而,这两种浏览器都警告不存在 Access-Control-Allow-Origin
header,这很奇怪,因为我希望 CORS 配置能够处理它。
最后,我在管道中的所有其他中间件之前设置了 CORS 配置(例如AddSignalR
),它终于成功了。
public void Configure(IApplicationBuilder app)
{
app.UseCors(...);
// Everything else
}
尝试使用 ConfigureServices 方法中的 AddCors 和 Addpolicy。这解决了我的问题。
在 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
);
然后首先在配置方法中添加:
app.UseCors("AllowOrigin");
我在 http://localhost:5002
本地有一个 .NET Core 2.2 服务器 运行,在 http://localhost:5000
.
在服务器端,我有文档中的示例集线器,刚刚重命名为 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();
}
CORS 配置改编自 this GitHub issue。
在客户端,我使用文档中的说明安装了 @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) {
...
});
我尝试了 http://localhost:5002/test
和 http://localhost:5002/custom/test
,但没有任何效果。 Chrome 只是说 net::ERR_FAILED
,而 Firefox 报告对 http://localhost:5002/test/negotiate?negotiateVersion=1
的 OPTIONS
调用的 405
响应。然而,这两种浏览器都警告不存在 Access-Control-Allow-Origin
header,这很奇怪,因为我希望 CORS 配置能够处理它。
最后,我在管道中的所有其他中间件之前设置了 CORS 配置(例如AddSignalR
),它终于成功了。
public void Configure(IApplicationBuilder app)
{
app.UseCors(...);
// Everything else
}
尝试使用 ConfigureServices 方法中的 AddCors 和 Addpolicy。这解决了我的问题。
在 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
);
然后首先在配置方法中添加:
app.UseCors("AllowOrigin");