How Redirect To Not Found Without Change Url In Blazor .Net 8

Question

How Redirect To Not Found Without Change Url In Blazor .Net 8

Mahdi Elahi 31

Hi,
How to redirect user to not found when page is not exists without change url in blazor ? Like this link : git not found

Azar 29,520 MVP Volunteer Moderator

Hey Mahdi Elahi You can do this using NavigationManager service along with a conditional rendering in your component. like this - first create a not found component

@page "/notfound"

<h3>Page Not Found</h3>
<!-- Add your not found content here -->

Then use a conditional rendering for not found like this

@page "/example"  @inject NavigationManager NavigationManager  @code {     bool pageExists = true; // Replace this with your logic to check if the page exists }  @if (pageExists) {     <!-- Your existing page content goes here --> } else {     <!-- Redirect to the not found page without changing the URL -->     <button @onclick="RedirectToNotFound">Redirect to Not Found</button> }  @code {     private void RedirectToNotFound()     {         // Redirect to the not found page without changing the URL         NavigationManager.NavigateTo("/notfound", forceLoad: true);     }

If this helps kindly accept the answer thanks much.

Mahdi Elahi 31 Reputation points

2024-01-14T20:09:42.55+00:00
thanks , but it's not worked , changed url with this code

nav.NavigateTo("/NotFound", forceLoad: true);
Farid Uddin Kiron MSFT 456 Reputation points Microsoft External Staff

2024-01-15T02:42:46.5566667+00:00

Well based on your scenario and description, in order to show a "not found" page without changing the URL in Blazor .NET 8, First of all, make a dedicated "Not Found" component. Then, inject a navigation manager in your main components. Use a conditional check (replace it with your own logic) to determine if the desired page exists. If not, display the "Not Found" component without actually changing the URL in the address bar. This is achieved by using the navigation manager's NavigateTo method with the forceLoad flag set to true. Remember to call this check when needed, like on component load or after specific actions.
Azar 29,520 Reputation points MVP Volunteer Moderator

2024-01-15T04:17:56.2966667+00:00

Hi, thanks for letting know? so after replacing like u mentioned is it sorted?
Mahdi Elahi 31 Reputation points

2024-01-15T04:31:13.9266667+00:00

No it's not worked and not replace view.
how to solve this problem ?
Farid Uddin Kiron MSFT 456 Reputation points Microsoft External Staff

2024-01-16T02:51:14.4666667+00:00

Are you getting any error or anything? Have checked the log?

3 answers

Your answer

Azar 29,520 Reputation points MVP Volunteer Moderator

2024-01-14T07:51:48.2033333+00:00

Hey Mahdi Elahi You can do this using NavigationManager service along with a conditional rendering in your component. like this - first create a not found component

@page "/notfound" <h3>Page Not Found</h3> 

Then use a conditional rendering for not found like this

@page "/example" @inject NavigationManager NavigationManager @code { bool pageExists = true; // Replace this with your logic to check if the page exists } @if (pageExists) {  } else {  <button @onclick="RedirectToNotFound">Redirect to Not Found</button> } @code { private void RedirectToNotFound() { // Redirect to the not found page without changing the URL NavigationManager.NavigateTo("/notfound", forceLoad: true); }

If this helps kindly accept the answer thanks much.
Mahdi Elahi 31 Reputation points

2024-01-14T20:09:42.55+00:00

thanks , but it's not worked , changed url with this code

nav.NavigateTo("/NotFound", forceLoad: true);
Farid Uddin Kiron MSFT 456 Reputation points Microsoft External Staff

2024-01-15T02:42:46.5566667+00:00

Well based on your scenario and description, in order to show a "not found" page without changing the URL in Blazor .NET 8, First of all, make a dedicated "Not Found" component. Then, inject a navigation manager in your main components. Use a conditional check (replace it with your own logic) to determine if the desired page exists. If not, display the "Not Found" component without actually changing the URL in the address bar. This is achieved by using the navigation manager's NavigateTo method with the forceLoad flag set to true. Remember to call this check when needed, like on component load or after specific actions.
Azar 29,520 Reputation points MVP Volunteer Moderator

2024-01-15T04:17:56.2966667+00:00

Hi, thanks for letting know? so after replacing like u mentioned is it sorted?
Mahdi Elahi 31 Reputation points

2024-01-15T04:31:13.9266667+00:00

No it's not worked and not replace view.
how to solve this problem ?
Farid Uddin Kiron MSFT 456 Reputation points Microsoft External Staff

2024-01-16T02:51:14.4666667+00:00

Are you getting any error or anything? Have checked the log?

Answer 1

The solution is to use NotFound in combination with UseStatusCodePagesWithReExecute:

Step 1: Add the following to Program.cs

app.UseHttpsRedirection();

// Add this line
app.UseStatusCodePagesWithReExecute("/not-found");

app.UseStaticFiles();

...

Step 2: Add a dummy .razor page with the same url

@page "/not-found"

<My404Component />

Step 3: Add a NotFound renderfragment to Routes.razor

<Router>
  <Found>
    ...
  </Found>
  <NotFound>
    <LayoutView Layout="typeof(MyLayout)">
      <My404Component />
    </LayoutView>
  </NotFound>
</Router>

The documentation states NotFound in Router is no longer supported, but this is actually not true, it still works but only if you do step 1 and 2 first, see https://github.com/dotnet/aspnetcore/issues/51203#issuecomment-1992085307

Answer 2

Mahdi Elahi 31

@Farid Uddin Kiron MSFT No I dont have any error
but i want load not found component content without navigation to not found page and without change url
like this : example for not found page
its's not change url just load content
not found page

Answer 3

Bruce (SqlWork.com) 77,686 Volunteer Moderator

just follow the docs and a not found component to the <Router>

<Router ...>
    ...
    <NotFound>
        ...
    </NotFound>
</Router>

see docs:

https://learn.microsoft.com/en-us/aspnet/core/blazor/fundamentals/routing?view=aspnetcore-8.0

Mahdi Elahi 31 Reputation points

2024-01-17T04:35:12.9933333+00:00

@Bruce (SqlWork.com) add <notfound>but it's not worked
you can see my project : Repo in Git run project and search a not exists address
Mahdi Elahi 31 Reputation points

2024-01-18T13:13:49.7566667+00:00

@Bruce (SqlWork.com)
I read document (https://learn.microsoft.com/en-us/aspnet/core/blazor/fundamentals/routing?view=aspnetcore-8.0) :
in document =>
This section only applies to Blazor WebAssembly apps. Blazor Web Apps don't use the NotFound template (<NotFound>...</NotFound>), but the template is supported for backward compatibility to avoid a breaking change in the framework. ... but i use blazor web apps i must used this :
app.UseStatusCodePagesWithRedirects("/StatusCode/{0}"); it's worked but it's Changing the url , is there a way to do this (show not found without change url )
Mahdi Elahi 31 Reputation points

2024-01-18T13:14:39.29+00:00

@Farid Uddin Kiron MSFT thanks please show an example or sample code ?
Farid Uddin Kiron MSFT 456 Reputation points Microsoft External Staff

2024-01-23T09:16:46.13+00:00

Thanks for your response, could you please, share your current project structure and how did you placed your notfound component and how its been called. So that it would be easier to investigate your issue. Looking forward to your reply.

Share via

How Redirect To Not Found Without Change Url In Blazor .Net 8

3 answers

Your answer