Как внедрить сервер Blazor в производство и преодолеть проблемы с повторным подключением SignalR? - PullRequest
2 голосов
/ 03 февраля 2020

Blazor-сервер - это фантастическая технология c, но она постоянно ломается из-за того, что SignalR не может повторно подключиться к серверу.

Как можно это исправить в работе? У меня люди оставляют свои ноутбуки во сне или помещают телефон с веб-сайтом на 5 секунд, а затем - «Попытка переподключения».

И всегда не удается. Пользователи ждут только, чтобы увидеть кнопку «Перезагрузить».

Горячая, чтобы решить эту проблему и принудительно подключить SignalR, даже если веб-сайт не был активен в мобильных браузерах или в спящих браузерах p c?

1 Ответ

2 голосов
/ 03 февраля 2020

Обзор

В Blazor есть встроенные опции для настройки процесса запуска, но они не очень хорошо документированы.

Насколько я могу судить: Настройка клиент SignalR для приложений Blazor Server

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

Пример

В приведенном ниже примере кода , Я устанавливаю maxRetries и retryIntervalMilliseconds (строки 48/49) - которые определяют, насколько агрессивно клиент будет пытаться переподключиться в случае обрыва связи. минимальная реализация, которая попытается восстановить соединение (без отображения какого-либо пользовательского интерфейса), и если все попытки не удастся, она просто перезагрузит страницу.

Это не очень умная вещь, но она работает как пример для демонстрации как вы можете go настроить процесс.

Дополнительные сведения Клиент цепей AspNetCore Side Code

** ПОЖАЛУЙСТА, НЕ ИСПОЛЬЗУЙТЕ ЭТОТ ОБРАЗЕЦ В ПРОИЗВОДСТВЕ - ЭТО ТОЛЬКО ИЛЛЮСТРАТИВНО **

Сначала отключите процесс загрузки Blazor с помощью autostart="false"
<script autostart="false" src="_framework/blazor.server.js"></script>
Затем вы можете предоставить собственный обработчик подключений и настройки
<script>
    async function connectionDown(options) {
        console.log("Connection Down - you could do some UI here...");
        for (let i = 0; i < options.maxRetries; i++) {
            console.log("Waiting for reconnect attempt #"+(i+1)+" ...");
            await this.delay(options.retryIntervalMilliseconds);
            if (this.isDisposed) {
                break;
            }

            try {
                // reconnectCallback will asynchronously return:
                // - true to mean success
                // - false to mean we reached the server, but it rejected the connection (e.g., unknown circuit ID)
                // - exception to mean we didn't reach the server (this can be sync or async)
                console.log("Starting Reconnect attempt #"+(i+1)+" ...");
                const result = await window.Blazor.reconnect();
                if (!result) {
                    // If the server responded and refused to reconnect, log it 
                    console.error("Server Rejected");
                } else {
                    // Reconnected!
                    return;
                }
            } catch (err) {
                // We got an exception so will try again 
                console.error(err);
            }
        }
        // all attempts failed - let's try a full reload
        // This could be a UI change instead or something more complicated
        location.reload();
    }

    function delay(durationMilliseconds) {
        return new Promise(resolve => setTimeout(resolve, durationMilliseconds));
    }

    function connectionUp(e) {
        // Reconnected
        console.log("Connection UP!");
        // if you have a UI to hide/change you can do that here.
    }

    window.Blazor.start({
        reconnectionOptions: {
            maxRetries: 30,
            retryIntervalMilliseconds: 500,
        },
        reconnectionHandler: {
            onConnectionDown: e => connectionDown(e),
            onConnectionUp: e => connectionUp(e)
        }
    });
</script>
...