I'm building a website with Blazor Web Assembly hosted in ASP.NET Core (NET7
). The website is a project for the university that is basically an online magazine. There will be new content and I want to use SEO in order to have visibility in the search engine. I have created a few components that are working.
At the moment, my project has the classic structure:
- Server (ASP.NET Core project)
- Client (Blazor Web Assembly)
The Server uses the Individual Identity based on the Identity Server that Microsoft offers out of the box. Plus, I added all the secure headers and Content-Security-Policy
.
In the Client, I have already created a few pages that use all the components I created. Also, I created the components for the design in a Razor Library and a few of them are using JavaScript
(and I wrote the JSInterop
for them).
Because the website needs to be indexed by Google and other search engines and also shows advertisements, I read in a few posts online that it definitely not the best way to build the website with Blazor Web Assembly. I like the idea of having a PWA for the website. One feature I want to keep is the search. Some content on every page changes based on the user customisation like the language.
The main issue is that the browser can't see all the pages on the website but only the classic error message and a bit more from the index.html
. Although it is possible to add in the head
of a rendered page some meta
tags, search engines are not able to index all the pages.
So, I started to look online for some how-to or tutorials. I found this post Enabling prerendering for Blazor WebAssembly apps but he migrated a brand new Blazor WebAssembly to a Server. From a brand new Blazor Web Assembly project, here are the steps to convert it into a Blazor Server.
- Add
_Host
Page, dotnet new page -o Pages -n _Host --no-pagemodel
- Copy Client/wwwroot/index.html into it, keeping
@page
at the top
- Add tag helper,
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
- Replace
<div id="app">
with <component type="typeof(BlazorApp1.App)" render-mode="WebAssemblyPrerendered" />
- Remove
builder.RootComponents.Add<App>("#app")
from Program.cs
- Add an HTTP client to the server, e.g.
services.AddSingleton<HttpClient>
.
After that, I get a lot of errors plus I have to add the code for the Individual Identity and the security from the Server project.
I read it is possible to use some online services to cache the website like prerender.io but pricy or generate the HTML pages from the website using for example react-snap. I can't afford the first solution and I don't like the second because there is no interaction with the user.
What I realized at this point is that I prefer to move to Blazor Server because:
Here are my questions:
- Is Blazor Server the right decision to build the application?
- Should ASP.NET Core MVC be a better option?
- How can I convert a Blazor Web Assembly in a Blazor Server?
- Do I have to rewrite my components?
- Is there anything else I have to consider that I missed to mention?