Skip to content

Enhance Blazor.reconnect to state whether failures are due to circuit not existing so we can auto-reload page #44669

Closed
@Alerinos

Description

@Alerinos

Is there an existing issue for this?

  • I have searched the existing issues

Is your feature request related to a problem? Please describe the problem.

I created a connection support. If it is broken, a message pops up and then every 30 seconds the system tries to establish a connection.

        let network = document.getElementById("network");
        let offline = document.getElementById("offline");
        let online = document.getElementById("online");

        let connect = true; @* Connection life status *@
        let reconnectId = null;     @* Clock ID to reconnect *@

        Blazor.start({
            reconnectionHandler: {

                @* Disconnect *@
                onConnectionDown: (options, error) => {
                    connect = false;
                    network.classList.remove("hidden");
                    offline.classList.remove("hidden");

                    @* First connect *@
                    window.Blazor.reconnect();

                    @* trying to establish a connection *@
                    reconnectId = setInterval(() => { 
                        if(connect == true){
                            console.log("Close timer...");
                            clearInterval(reconnectId);
                        }
                        console.log("Reconnect in progress...");
                        window.Blazor.reconnect();
                    }, 1000 * 30);
                },

                @* Connect *@
                onConnectionUp: () => {
                    connect = true;
                    offline.classList.add("hidden");
                    online.classList.remove("hidden");

                    setTimeout(() => {
                        network.classList.add("hidden");
                        online.classList.add("hidden");
                    }, 3000);
                }
            }
        });

Everything works fine until the server loses sessions.
This causes an error that requires the entire page to be reloaded.

I need a function in javascript to check the state if there is a connection to blazor, if it has been broken, if there is any error.
An event like onError:

Example:

onError: () => {
 location.reload()
}

Describe the solution you'd like

    <div id="blazor-error-ui">
        <environment include="Staging,Production">
            An error has occurred. This application may no longer respond until reloaded.
        </environment>
        <environment include="Development">
            An unhandled exception has occurred. See browser dev tools for details.
        </environment>
        <a href="" class="reload">Reload</a>
        <a class="dismiss">🗙</a>
    </div>

Currently, the only option is to manually click or call the meta tag refres, it is not a professional solution.

By the way, why are broken connections by the server not handled? This can be done without reloading the page ...

Also, better handling of the call, more automatic than manual, would be useful. People who see the default messages are scared and leave the site, which results in a drop in impressions.

Additional context

No response

Metadata

Metadata

Assignees

Labels

✔️ Resolution: AnsweredResolved because the question asked by the original author has been answered.Priority:1Work that is critical for the release, but we could probably ship withoutStatus: Resolvedarea-blazorIncludes: Blazor, Razor ComponentsenhancementThis issue represents an ask for new feature or an enhancement to an existing one

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions