Hello.
Have anyone managed to use blazor inside a plugin in admin panel for nopCommerce?
I've tried registering blazor the same way as this guide, but for some reason i end up with a 404 on _framework/blazor.server.js no matter what i do.
blazor in admin (plugin)
- 1
- 2
MVP
Certified Developer
- 792
- 7210
- 4/29/2021
- Bangladesh
This might help you. You can check this full message thread nopCommerce with Blazor
Silver Solution Partner
Certified Developer
- 332
- 2270
- 3/2/2018
- Norway
Rashed Khan wrote:
Thanks, but sadly that is not working. I think the issue is staticfiles. The blazor.server.js file cant be found if i navigate to https://localhost:5001/_framework/blazor.server.js
But, in the post you linked he is mapping a fallback to a controller Blazor with action home. I dont know why he would do that. Cant see any controller named blazor in his example either
This might help you. You can check this full message thread nopCommerce with Blazor
Thanks, but sadly that is not working. I think the issue is staticfiles. The blazor.server.js file cant be found if i navigate to https://localhost:5001/_framework/blazor.server.js
But, in the post you linked he is mapping a fallback to a controller Blazor with action home. I dont know why he would do that. Cant see any controller named blazor in his example either
Silver Solution Partner
Certified Developer
- 332
- 2270
- 3/2/2018
- Norway
I've gotten a bit further.
I have added the following right into (ill move it to custom startups later when its working).
ApplicationBuilderExtensions.cs
At the end of UseNopStaticFiles i added
application.UseStaticFiles();
and inside UseNopEndpoints:
public static void UseNopEndpoints(this IApplicationBuilder application)
{
//Execute the endpoint selected by the routing middleware
application.UseEndpoints(endpoints =>
{
//register all routes
EngineContext.Current.Resolve<IRoutePublisher>().RegisterRoutes(endpoints);
endpoints.MapBlazorHub();
});
}
And in ServiceCollectionExtensions.cs i added
Below this: services.AddRazorPages();
I added services.AddServerSideBlazor();
In home.cshtml i added:
@(await Html.RenderComponentAsync<Nop.Web.Views.Shared.Component.TestComponent>(RenderMode.ServerPrerendered))
In _ViewImports.cshtml i added:
@using System.Net.Http
@using Microsoft.AspNetCore.Authorization
@using Microsoft.AspNetCore.Components.Authorization
@using Microsoft.AspNetCore.Components.Forms
@using Microsoft.AspNetCore.Components.Routing
@using Microsoft.AspNetCore.Components.Web
@using Microsoft.JSInterop
@using System.IO
In _Root.cshtml i added:
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
and inside <head>
<base href="/" />
and below </html> i added
<!script src="_framework/blazor.server.js"></!script>
In TestComponent.razor i added:
<div class="card-header">
<h3>DataComponent</h3>
<button @onclick="Getdata" class="btn btn-dark">Click to GetData </button>
</div>
<div class="card-body">
<br />
<div class="@style">@Data </div>
</div>
@code {
[Parameter]
public string Data { get; set; } = string.Empty;
[Parameter]
public string style { get; set; }
private void Getdata()
{
Data = "I am Working";
style = "badge-success";
}
}
I am now able to see and navigate to https://localhost:5001/_framework/blazor.server.js
but i get the following issue now:
Microsoft.AspNetCore.Routing.Matching.AmbiguousMatchException: The request matched multiple endpoints. Matches:
Blazor initializers
Blazor initializers
Nop.Web.Controllers.CommonController.GenericUrl (Nop.Web)
I have added the following right into (ill move it to custom startups later when its working).
ApplicationBuilderExtensions.cs
At the end of UseNopStaticFiles i added
application.UseStaticFiles();
and inside UseNopEndpoints:
public static void UseNopEndpoints(this IApplicationBuilder application)
{
//Execute the endpoint selected by the routing middleware
application.UseEndpoints(endpoints =>
{
//register all routes
EngineContext.Current.Resolve<IRoutePublisher>().RegisterRoutes(endpoints);
endpoints.MapBlazorHub();
});
}
And in ServiceCollectionExtensions.cs i added
Below this: services.AddRazorPages();
I added services.AddServerSideBlazor();
In home.cshtml i added:
@(await Html.RenderComponentAsync<Nop.Web.Views.Shared.Component.TestComponent>(RenderMode.ServerPrerendered))
In _ViewImports.cshtml i added:
@using System.Net.Http
@using Microsoft.AspNetCore.Authorization
@using Microsoft.AspNetCore.Components.Authorization
@using Microsoft.AspNetCore.Components.Forms
@using Microsoft.AspNetCore.Components.Routing
@using Microsoft.AspNetCore.Components.Web
@using Microsoft.JSInterop
@using System.IO
In _Root.cshtml i added:
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
and inside <head>
<base href="/" />
and below </html> i added
<!script src="_framework/blazor.server.js"></!script>
In TestComponent.razor i added:
<div class="card-header">
<h3>DataComponent</h3>
<button @onclick="Getdata" class="btn btn-dark">Click to GetData </button>
</div>
<div class="card-body">
<br />
<div class="@style">@Data </div>
</div>
@code {
[Parameter]
public string Data { get; set; } = string.Empty;
[Parameter]
public string style { get; set; }
private void Getdata()
{
Data = "I am Working";
style = "badge-success";
}
}
I am now able to see and navigate to https://localhost:5001/_framework/blazor.server.js
but i get the following issue now:
Microsoft.AspNetCore.Routing.Matching.AmbiguousMatchException: The request matched multiple endpoints. Matches:
Blazor initializers
Blazor initializers
Nop.Web.Controllers.CommonController.GenericUrl (Nop.Web)
- 7
- 65
- 8/11/2022
- Australia
How did you go with this?
Blazor is a SPA framework. Are you looking at totally replacing the front end for customers and you the NOP web api? Or are you just wanting to use Blazor as components?
If it is just Blazor as components on a page, then I have a solution that I can share with you that works with MVC and should work with NOP.
Blazor is a SPA framework. Are you looking at totally replacing the front end for customers and you the NOP web api? Or are you just wanting to use Blazor as components?
If it is just Blazor as components on a page, then I have a solution that I can share with you that works with MVC and should work with NOP.
- 1
- 2