Include blazor component into MVC view (.NET Core 3 Preview #5)

Question

I'm trying to include a blazor component into my MVC application, but something with the endpoint routing does not seem okay.

I have a razor page (in pages/example.cshtml) and a default controller (in Controllers/Home) with views (in Views/Home/Index.cshtml).

Opening...

[local] -> index view, Blazor works
[local]/Home -> index view, Blazor works
[local]/Example -> example page, Blazor works
[local]/Home/ -> index view, Blazor DOES NOT work
[local]/Home/Index -> index view, Blazor DOES NOT work

The script debugger says: HTTP404: NOT FOUND - The server has not found anything matching the requested URI (Uniform Resource Identifier). (XHR)POST - https://localhost:44342/Home/_blazor/negotiate

I tried different things in the startup file, but whatever I tried I wasn't able to make it work.

    public void ConfigureServices(IServiceCollection services)
    {
        services.AddRazorPages();
        services.AddServerSideBlazor();
        services.AddSingleton<WeatherForecastService>();
        //services.AddControllersWithViews(o => o.EnableEndpointRouting = false); -> does not change anything
        services.AddMvc(o => o.EnableEndpointRouting = false);
    }

    public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    {
        if (env.IsDevelopment())
        {
            app.UseDeveloperExceptionPage();
        }
        else
        {
            // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
            app.UseHsts();
        }

        app.UseHttpsRedirection();

        app.UseStaticFiles();

        app.UseMvcWithDefaultRoute();
        app.UseRouting();

        app.UseEndpoints(endpoints =>
        {
            endpoints.MapBlazorHub();
            //endpoints.MapControllers();  -> does not change anything
            //endpoints.MapDefaultControllerRoute(); -> does not change anything
        });
    }
}

Does the prerendering work, ie do you see the component in a MVC page? — Henk Holterman
Yes. If I add a break point to code initializing something in the component, the debugger will stop during the prerendering of it. Only the communication from the browser to the server does not work. — Tobi
I've opened an issue about this since it's still prevalent in preview 8. github.com/aspnet/AspNetCore/issues/13594 — helloserve

helloserve helloserve · Accepted Answer · 2019-09-04T10:34:05

The issue on GitHub has been resolved by one of the devs: https://github.com/aspnet/AspNetCore/issues/13594#issuecomment-527821142

This is by design. You need to set the base path for the document using <base href="~/" /> inside the head tag of your html page. Alternatively you can manually start blazor as in

    <script src="_framework/blazor.server.js" autostart="false"></script>
    <script>
        Blazor.start({
            configureSignalR: function (builder) {
                builder.useUrl(@("/"))
            }
        });
    </script>

although this second solution might prevent links from working properly.

Include blazor component into MVC view (.NET Core 3 Preview #5)

1 Answers