CODEWITHSUNDEEP
blazor
baer999
baer999

Reputation: 972

Blazor: The list of component records is not valid

using Blazor dotnet core 3.1 and getting this error:

The list of component records is not valid

Found a bug report regarding this that was closed in december 2019: https://github.com/dotnet/aspnetcore/issues/14966 enter image description here Don't see any reason for this error and hope there is a workaround (can not make this error each page call, it's just happening very rarely...).

Does anybody has an idea / hint which could cause this?

Thx!

Upvotes: 9

Views: 7093

Answers (8)

David Thielen
David Thielen

Reputation: 32874

I got this and fixed it (basically by diff-ing between the last good git copy and the first problematic one). To handle Identity in Blazor you need to get a XREF token in the .cshtml startup and save it to use in the .razor pages where appropriate.

If you follow any of the examples, the class you are given to carry this across is:

public class TokenProvider
{
    public string? XsrfToken { get; set; }
    public string? Cookie { get; set; }

}

public class InitialApplicationState
{
    public string? XsrfToken { get; set; }
    public string? Cookie { get; set; }
}

The above works fine. What doesn't work fine and gives you this error is if you mark the properties in InitialApplicationState as required, as below:

public class TokenProvider
{
    public string? XsrfToken { get; set; }
    public string? Cookie { get; set; }

}

public class InitialApplicationState
{
    public required string XsrfToken { get; set; }
    public required string Cookie { get; set; }
}

Why? I have no idea. But this fixes it.

Upvotes: 0

Michael Schreiber
Michael Schreiber

Reputation: 43

All I had to do was to update the NuGet packages.

Upvotes: 0

sunilski
sunilski

Reputation: 1

@Eilon is correct the snippet must be added to the Configure method of startup, if you intend on using SignalR service in Azure.

if (!HostingEnvironment.IsDevelopment())
{
    services.AddSignalR().AddAzureSignalR(options =>
    {
        options.ServerStickyMode = Microsoft.Azure.SignalR.ServerStickyMode.Required;
    });

}

Upvotes: 0

Vagner Gon
Vagner Gon

Reputation: 645

This issue may happen by browser's automatic Cache control.

Let's say you have two MVC views with Blazor components within: Pages A.cshtml and B.cshtml.

When requesting page A, you receive a html response with the Blazor component rendered and a connection is stablished. Then, you navigate to page B. If you go back to page A (e.g. pressing back button) your browser will use a cached response made previously to fetch page A.

This should break the connection between Client and Server as the component descriptors may be changed. (sometimes seems randonmly).

To solve this, disable this cache behaviour on your _Host.cshtml adding:

@{ 
    Context.Response.Headers["Cache-Control"] = "no-store";
}

This will prevent the caching from your browser and make it request a new page with a correct components descriptor.

References: https://github.com/dotnet/aspnetcore/issues/26174#issuecomment-705472525 https://github.com/dotnet/aspnetcore/issues/18143#issuecomment-585961784

Upvotes: 6

John Miller
John Miller

Reputation: 13

In my case, this came down to the location of the blazor.server.js file. We use a partial as a bundle file to include all the script locations.

@await Html.PartialAsync("_jsBundles")

Attempting to fix a sporadic timing issue where a JS Interop function was not found, this was moved from the body to the head element. This caused the list of component records error to be thrown sporadically by the blazor.server.js, causing the pages not to load and preventing the circuit from starting.

As this was not the only change in the sprint, I spent hours debugging this issue. For some reason having the blazor.server.js in the head element would sporadically cause the circuit to start with a sequence parameter of 1 instead of 0, throwing an error that the descriptor sequence must start with 0 which in turn triggers the list of component records error returned to blazor.server.js.

Long story short, we ended up having to move the js bundles partial back to the body (specifically after @RenderBody()) in order to resolve this issue. Hoping this will save someone else time debugging who is running into the same error.

Upvotes: 0

Vitalii Vagin
Vitalii Vagin

Reputation: 104

In my case problem "The list of component records is not valid" was when Blazor need to serialize parameter for component in _Host.cshtml

<component type="typeof(App)" render-mode="Server" param-SessionData="@Model.SessionData" />

After long searching of the issue I've found that problem was because of NameValueCollection that was cloning in SessionData before serialization. I dont why but when I excluded variable with NameValueCollection type issue was resolved.

SessionData is a class that has a Query property of type NameValueCollection and its values were cloned in a standard way:

Query = (Query?.Count ?? 0) != 0 ? new NameValueCollection(Query) : new NameValueCollection()

I've try clone with for loop function for each item in collection but it's not helped. Only after exclusion of Query property problem was resolved.

Upvotes: 1

Marcio Goularte
Marcio Goularte

Reputation: 51

In my case it was a class that I was using as a cascade value, but it didn't have a constructor without parameters

public class User 
{
            
    public User(ClaimsPrincipal principal) 
    {
       ....
    }
       ....
 }

 public class User 
 {
    //this fix
    public User(){}
    public User(ClaimsPrincipal principal) 
    {
       ....
    }
       ....
 }

[CascadingParameter]
private User User { get; set; }

Upvotes: 5

Eilon
Eilon

Reputation: 25704

I hit the same issue when I upgraded my app from .NET Core 3.0 to .NET Core 3.1 while using Blazor Client. The first "fix" I found was to do a force-refresh on the client (the web browser). That is, I pressed Ctrl+F5 to refresh.

I'm assuming that there was some API call that was being cached on the client and due to some version/format changes from 3.0 to 3.1, the old cached data was no longer valid, causing an error.

I'll be contacting the people who work on Blazor to try to get more info (I work with them at Microsoft).

Update June 1, 2020

I hit this again running my app on Azure App Services. This time even Ctrl+F5 didn't work. But I found https://stackoverflow.com/a/59356356/31668, and applied the fix there, which seemed to fix my problem.

I made a slight change to the code because in my case I use the Azure SignalR service only in staging/production and not in development. So I have this code in my app's Startup.cs ConfigureServices method:

if (!HostingEnvironment.IsDevelopment())
{
    services.AddSignalR().AddAzureSignalR(options =>
    {
        options.ServerStickyMode = Microsoft.Azure.SignalR.ServerStickyMode.Required;
    });
}

Upvotes: 8

Related Questions