question

Elisheva-6467 avatar image
0 Votes"
Elisheva-6467 asked Bruce-SqlWork commented

Blazor - Page Loads But Code Not Running Until SignalR Connection Opens


When my Blazor page starts up, you can see the page and type in the inputs. However, none of the event handlers get called. After about 2-3 seconds, all of the inputs get cleared and the event handlers start responding.

I think this is happening because the websocket connection wasn't ready when the page loaded.

Is there a way that I can set up the websocket connection earlier or prevent the page from displaying until the websocket connection is set up?

dotnet-aspnet-core-blazor
· 1
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Create a new Blazor (Server?) project and review the sample code for FetchData.razor. Also see ASP.NET Core Razor component lifecycle and ASP.NET Core Razor component lifecycle which explain what happens when a Blazor app first loads.


0 Votes 0 ·

1 Answer

Bruce-SqlWork avatar image
0 Votes"
Bruce-SqlWork answered Bruce-SqlWork commented

You appear to be using server pre-render, but not persisting the pre-render state:

https://docs.microsoft.com/en-us/aspnet/core/blazor/components/prerendering-and-integration?view=aspnetcore-6.0&pivots=server

· 2
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Thank you for pinpointing my problem! Do you have any suggestions as to what I should change?
I looked at the link and it seems to be saying that I should be persisting the pre-render state - should I add the <persist-component-state/> tag to my _Host.cshtml? It isn't there currently.

At the top of the body of the _Host.cshtml it says <component type="typeof(App) render-mode="Server-Prerendered" /> if that helps.

0 Votes 0 ·

You enable the support of the persistence with the tag, but you still need to add support to your components that use it.

The persistent state needs to be downloaded to the client, so you want it as small as possible.

0 Votes 0 ·