9

I am trying to deploy my Blazor Server application under /app which is a sub application in IIS. I read on several places online that I need to set the following:

Startup.cs | app.UsePathBase("/app")

and

_Host.cshtml | <base href="~/app/" />

But when I run this I get the following error:

blazor.server.js:15 [2020-05-26T16:16:11.796Z] Error: The circuit failed to initialize.
e.log @ blazor.server.js:15
blazor.server.js:1 [2020-05-26T16:16:11.798Z] Information: Connection disconnected.
blazor.server.js:1 Uncaught (in promise) Error: Invocation canceled due to the underlying connection being closed.
    at e.connectionClosed (blazor.server.js:1)
    at e.connection.onclose (blazor.server.js:1)
    at e.stopConnection (blazor.server.js:1)
    at e.transport.onclose (blazor.server.js:1)
    at e.close (blazor.server.js:1)
    at e.stop (blazor.server.js:1)
    at e.<anonymous> (blazor.server.js:1)
    at blazor.server.js:1
    at Object.next (blazor.server.js:1)
    at a (blazor.server.js:1)

If I change to (without trailing slash)

_Host.cshtml | <base href="~/app" />

The application runs but without any /app before the URL (no change as far as I can see).

On some example I saw that they changed the BlazorHub path but I just cannot get it to work. The reason behind this is to be able to host application and landing page as separate IIS sites.

3
  • 1
    You can try to create a new default blazor application and test if there is a problem. Commented May 27, 2020 at 7:35
  • 1
    The default blazor application deploys to / and that works. I want to deploy to subpath /app Commented May 28, 2020 at 6:50
  • 1
    you ever find a solution for this? i have the same issue Commented Aug 27, 2020 at 17:14

4 Answers 4

4

This works for us: <base href="/app/" />

Note the trailing slash, it is important.

It is documented in the official Blazor docs here: https://learn.microsoft.com/en-us/aspnet/core/blazor/host-and-deploy/?view=aspnetcore-3.1&tabs=visual-studio#app-base-path

Sign up to request clarification or add additional context in comments.

Comments

0

In _host.chtml set base to

<base href="~/" />

Don't add app.UsePathBase("/app") in your pipeline

In IIS site menu Add Application. Bind it to directory where your app exists.

Set up new application pool for that SubApp ( No managed code )

To share Identity Cookie add

services.AddDataProtection()
.PersistKeysToFileSystem(new DirectoryInfo(@"D:\tmp\Keys"))
.ProtectKeysWithDpapi(protectToLocalMachine:true)
.SetApplicationName("SharedCookieApp");

services.ConfigureApplicationCookie(options =>
          {
              options.Cookie.Path = "/";

          });

3 Comments

I needed both the <base href="" /> set to the correct path and the app.UsePathBase call. Setting the base href called the application to use the correct URL, but everything returned 404.
I said what I done and what was worked for me. Notice that I added some applications to IIS site each has base sat to "~/". One app added to path ( in IIS ) say "/cool" other - to path "/best", third - to "/customers".
This is for sure the easiest approach. Pretty much the POINT of IIS is to allow you to easily configure and serve your apps however you want. No Blazor coding required! (Good to learn about cookie sharing, though, I never knew about that)
0

This is verified to work with .NET 8 in 2024.

Blazor serverside

You need this in Program.cs:

// Important, needs to be directly after .Build() function
app.MapBlazorHub("/subdir");
app.Map("/subdir/signalr", subapp =>
{
  subapp.UsePathBase("/subdir/signalr");
  subapp.UseRouting();
  subapp.UseEndpoints(endpoints => endpoints.MapBlazorHub());
});

Webassembly & Blazor serverside

In App.razor you need to modify the base href:

<base href="/subdir/">

If you want to do this only for production, you can programmatically change it like this:

@inject NavigationManager nav
@if (nav.Uri.Contains("/subdir"))
{
    <base href="/subdir/">
}
else
{
    <base href="/">
}

Then verify that no links, or embedded javascript or CSS starts with a slash. It should look like this:

<script src="_framework/blazor.web.js"></script>
<link href="css/site.min.css" rel="stylesheet" />
<a href="aboutus">About us</a>
<a href="?getUser=1">Get user</a>

Read more details in the official documentation,

Comments

0

Does your sub app share authentication and so on with the primary app? If not, you don't need to do ANY configuration in Blazor at all-- just set up your app in IIS. My homepage is an old WebForms app, with separately-running Blazor apps.

--edit-- DimaSUN has it right. Your various apps and sub-apps don't even need to be the same type.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.