Блог

У меня возникли некоторые проблемы с проектом, который пытается использовать SignalR для вызова запроса на чтение источника данных для всех подключенных клиентов для обновления данных сетки, чтобы пользователи видели обновления в режиме реального времени.

Это работает локально IIS Express при запуске в Visual Studio с использованием двух открытых окон Chrome. SignalR подключается в обоих окнах и вызывает выполнение чтения источника данных без ошибок при изменении в любом окне браузера.

При развертывании на сервере под управлением IIS 10.0.17763.1 появляются ошибки.

Приложение размещено на одном сервере, и если открыто окно браузера, соединение с SignalR работает (я получаю журнал подключений консоли из вызова await connection.start). Но когда второе окно браузера открывается или открывается на другом компьютере, в консоли для каждого экземпляра браузера начинают появляться множественные сбои для SingalR.

Ошибки заключаются в следующем:

Браузерная машина 1:

     https://FQDN:2424/trafficWorkflowHub?id=YPCykB9G94tbgzlnZZDi5g 404 (Not Found) 
    Error: Server returned handshake error: An unexpected error occurred during connection handshake. 
    InvalidDataException: Missing required property 'protocol'. Message content: {"arguments": 
   [],"invocationId":"1","target":"UpdateDataSource","type":1} 
    TrafficWorkflow:181 Error: Not Found
        at new HttpError (signalr.js:1487)
        at XMLHttpRequest.xhr.onload (signalr.js:1777)
    TrafficWorkflow:182 connected
  

Браузерная машина 2:

  signalr.js:3927 WebSocket connection to 'wss://FQDN:2424/trafficWorkflowHub?id=2sW4zudCQKoysUQB9mB1vQ' 
failed: Error during WebSocket handshake: Unexpected response code: 404
signalr.js:2684 [2020-09-17T10:57:34.529Z] Information: SSE connected to 
https://FQDN:2424/trafficWorkflowHub?id=E9M_Wkbpt1KBPcHxLHhJXA
signalr.js:1788 POST https://FQDN:2424/trafficWorkflowHub?id=E9M_Wkbpt1KBPcHxLHhJXA 404 (Not Found)
signalr.js:2678 [2020-09-17T10:57:34.060Z] Error: Failed to start the transport 'WebSockets': null
  

Пример кода приведен ниже.

Код на стороне клиента:

 const connection = new signalR.HubConnectionBuilder()
    .withUrl("/trafficWorkflowHub")
    .build();

async function start() {
    try {
        await connection.start().catch(err => console.error(err));
        console.log("connected");
    } catch (err) {
        console.log(err);
        setTimeout(() => start(), 5000);
    }
}

connection.onclose(async () => {
    await start();
});


connection.on("ReceiveUpdates", function () {
    callDataSourceRead();
});
  

start() находится в разделе «Готовый документ».

вызов вызовов для обновления источника данных на страницах cshtml с помощью этого вызова:

  connection.invoke("UpdateDataSource").catch(function (err) {
                    return console.error(err.toString());
                });
  

Код на стороне сервера выглядит следующим образом:

   public class TrafficWorkflowHub : Hub
    {

        public async Task UpdateDataSource()
        {
            await Clients.All.SendAsync("ReceiveUpdates");
        }

    }
  

В Startup.cs
Общедоступная пустая настройка

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

Общедоступные пустые конфигурационные сервисы

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

Убедитесь, что вы настроили CORS следующим образом (порядок важен):

 services.AddCors(options =>
{
    options.AddPolicy(CorsPolicy, builder => builder.WithOrigins("https://yourFrameworkApp.azurewebsites.com")
        .AllowAnyHeader()
        .AllowAnyMethod()
        .AllowCredentials()
        .SetIsOriginAllowed((host) => true));
});
  

А затем убедитесь, что они есть в методе настройки при запуске:

 app.UseHttpsRedirection();
app.UseWebSockets();
  

И не забудьте включить веб-сокеты на сервере: