Problem:
Blazor Server SPA is returning 'Soft 404' error while accessing an internal URL/page directly from SEO crawler. If we access the same from Browser, it returns expected page content and not getting any error. Please help resolve this 'soft 404' issue by returning the page content to SEO crawler as browser get.
We have developed this SPA using Blazor Server technology(ASP.NET Core 6.0) and deployed in AWS EC2. It is a public site which serves the dynamic page content based on the route using NavigationManager. For SEO, we have given the sitemap.xml file which contains all the navigation URLs available in our site.
More details:
- Blazor-render-mode: Server
- SignalR Version: Microsoft.AspNetCore.SignalR.Client 6.0.0
Response for the URL requested:
An error has occurred. This application may no longer respond until reloaded. Reload Attempting to reconnect to the server... Reload
Reconnection failed. Try Reload the page if you're unable to reconnect.
Couldn't connect to the server Reload
_Host.cshtml
@page "/"
@namespace App.Pages
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@{
Layout = "_Layout";
}
@*
If we are use the renderMode as ServerPreRender, the CustomAuthenticationStateProvider throws
the exception on accessing local storage in pre rendering state.
NOTE: Due to pre-rendering in Blazor Server you can't perform any JS interop until the OnAfterRender lifecycle method.
*@
<component type="typeof(App)" render-mode="Server" />_Layout.cshtml
<head>
<base href="~/" />
<component type="typeof(HeadOutlet)" render-mode="Server" />
</head>
<body>
@RenderBody()
<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>
<environment include="Staging,Production,Development">
<div id="components-reconnect-modal" class="my-reconnect-modal components-reconnect-hide">
<div class="show">
<p>
Attempting to reconnect to the server...
<a href="" target="_top">Reload</a>
</p>
</div>
<div class="failed">
<p>
Reconnection failed. Try
<a href="" target="_top"> Reload </a>
the page if you're unable to reconnect.
</p>
</div>
<div class="rejected">
<p>
Couldn't connect to the server
<a href="" target="_top">Reload</a>
</p>
</div>
</div>
</environment>
<script src="_framework/blazor.server.js"></script>
</body>
</html>Program.cs
try
{
var builder = WebApplication.CreateBuilder(args);
// Add services to the container.
builder.Services.AddRazorPages().AddNewtonsoftJson();
builder.Services.AddControllers();
builder.Services.AddServerSideBlazor().AddCircuitOptions(options =>
{
// Set the detailed errors as 'true' to display the detailed
// unhandled exception message in browser for developement purpose,
options.DetailedErrors = true;
});
// Other dependent Scoped and Transient services and models
builder.Services.AddSignalR();
var app = builder.Build();
// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
app.UseExceptionHandler("/Error");
}
app.UseHttpsRedirection();
app.UseStaticFiles();
app.UseRouting();
app.UseAuthentication();
app.UseAuthorization();
app.UseEndpoints(endpoints =>
{
endpoints.MapControllers();
endpoints.MapBlazorHub();
app.MapHub<ChatHub>("/chathub");
endpoints.MapFallbackToPage("/_Host");
});
app.Run();
}
catch (Exception ex)
{
Log.Fatal(ex, "The application failed to start.");
}
finally
{
//Log.CloseAndFlush() only needs to be called once in a console application,
//before the application exits
Log.CloseAndFlush();
} My understanding
While directly accessing the page from crawlers, the Blazor components and SignalR connection will not be established by default. How can we achieve that and get the page content instead of getting reconnect error?