question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Blazor Component Embedded in Razor Page

See original GitHub issue

Repo: https://github.com/CarrotSolutions/WebApplication1.git

Please Help! We created a basic template razor page app. We added Blazor components. We have no problem getting this to work via replicating the steps in the 04/16 Blazor Update video or using the Blazor documentation. However, once we add the Blazor component to a Razor page, all of our asp-page links no longer work. The url changes in the address bar, but we remain on the same page. The startup file is as follows:

public void ConfigureServices(IServiceCollection services)
        {
            services.Configure<CookiePolicyOptions>(options =>
            {
                options.CheckConsentNeeded = context => true;
            });


            services.AddRazorPages()
                .AddNewtonsoftJson();

            services.AddServerSideBlazor();
        }

        public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
        {
            if (env.IsDevelopment())
            {
                app.UseDeveloperExceptionPage();
            }
            else
            {
                app.UseExceptionHandler("/Error");
                app.UseHsts();
            }

            app.UseHttpsRedirection();
            app.UseStaticFiles();

            app.UseCookiePolicy();

            app.UseRouting();

            app.UseAuthorization();

            app.UseEndpoints(endpoints =>
            {
                endpoints.MapRazorPages();
                endpoints.MapBlazorHub();
            });
        }

Page with working Component and broken link


<a asp-page="./Index">Home</a>

<br /> 

<div id="Counter"> 
    @(await Html.RenderComponentAsync<Counter>()) 
    <script src="~/_framework/blazor.server.js">
</script> 

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:7 (1 by maintainers)

github_iconTop GitHub Comments

5reactions
CarrotSolutionscommented, May 1, 2019

Exactly, The capability of being able to use Blazor components inside of existing Razor or MVC apps is where this tech will gain traction in the beginning . Note, I also tried mapping the razor pages inside Startup, verifying all pages has unique routes, etc. Nothing works.

1reaction
danroth27commented, May 30, 2019

@chrdlx Yes, but potentially with some latency as it takes some time for all the ASP.NET Core bits to make their way into the .NET Core SDK builds: https://github.com/aspnet/AspNetCore/blob/master/docs/DailyBuilds.md

Read more comments on GitHub >

github_iconTop Results From Across the Web

Integrating Blazor components into Razor Pages and MVC ...
Integrate the Blazor component into a razor page, such as Index.razor , using the component tag helper, and add the Blazor server script....
Read more >
ASP.NET Core Razor components
Blazor apps are built using Razor components, informally known as Blazor components or only components. A component is a self-contained portion ...
Read more >
Exploring ASP.NET Core C# 7 Razor View vs. Blazor View
NET Core in C#, Razor and Blazor work together. ... model where the Blazor component can only be embedded inside a Razor .cshtml...
Read more >
Prerender and integrate ASP.NET Core Razor components
The following sections and examples for embedding Razor components from the Client Blazor WebAssembly app into pages and views of the server ...
Read more >
Using Razor Components In A Razor Page
Razor components form part of the Blazor framework. Blazor is a single page application development framework whose key feature is that it ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found