.NET 6 Blazor - Modifying stuff in head and base path attribute

Darrell Tunnell 6 Reputation points
2021-09-28T15:23:41.943+00:00

There is a well known issue with blazor in that there is a base href attribute in the HEAD. When running the site locally this may work, but if the site ends up being deployed under a path like www.foo.com/mysite instead of on the root url then the base href needs updating at deployment time.

For a better description of the issue i'm talking about - read this: https://blog.elmah.io/how-to-fix-blazor-wasm-base-path-problems/

So now for my question.. I saw a new capability for razor pages in .net 6 where the server can modify HTML tags placed in the HEAD. of the html web page.
Suppose our blazor wasm index.html is being served up from an asp.net core backend, does this mean that it should be possible to modify the base href tag in the index html dynamically at runtime, based on the PATH the server is serving the static files up on? If so are there any examples of this?

ASP.NET Core
ASP.NET Core
A set of technologies in the .NET Framework for building web applications and XML web services.
4,156 questions
Blazor
Blazor
A free and open-source web framework that enables developers to create web apps using C# and HTML being developed by Microsoft.
1,383 questions

1 answer

Sort by: Most helpful
Most helpful Newest Oldest
  1. Zhi Lv - MSFT 32,011 Reputation points Microsoft Vendor
    2021-09-29T09:35:59.28+00:00

    Hi @Darrell Tunnell ,

    Please check this document: when control the <head> content in ASP.NET Core Blazor apps, the new component is appended to the existing head contents instead of replacing the content. This allows the app to retain static head content in wwwroot/index.html without having to repeat the content in the app's Razor components.

    136275-image.png

    So, as the blog said, if you want to set the base path at runtime or depending on where we host. You can change it via JavaScript script.

    If the answer is helpful, please click "Accept Answer" and upvote it.
    Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

    Best regards,
    Dillion

    0 comments