.NET 8 Blazor - NavigationManager.NavigateTo() Inconsistent Behavior

[sbwalker]

Is there an existing issue for this?

• I have searched the existing issues

Describe the bug

A very common use case in web applications is that the user may need to navigate to another Url. Usually this is accomplished with a standard hyperlink - however there are often scenarios where you need to do some validation or processing prior to redirecting the user.

In Interactive render mode you can use an @onclick handler and call NavigationManager.NavigateTo(). However if you are creating components which support Static render mode, the @onclick handler approach does not work so you need to use standard forms and button instead.

The component code below includes a simple form with a button which performs a redirect:

@inject NavigationManager NavigationManager

<form method="post" @onsubmit="Submit" @formname="MyUniqueFormName">
    <AntiforgeryToken />
    <button type="submit" class="btn btn-primary">Redirect</button>
</form>

@code {
    private void Submit()
    {
        NavigationManager.NavigateTo("/");
    }
}

When running this code on Interactive render mode it works fine... it redirects the user to the "/" path.

However when running this code on Static render mode, it throws an exception:

Similar behavior related to NavigationManager has been reported previously (ie. #13582) however the recommended solution was to instruct the developer to ignore the exception in their Visual Studio IDE:

This is not a good resolution, as most developers would not have this exception ignored by default, and most developers would assume it is a problem with the Blazor application code.

Expected Behavior

Expected behavior would be for the NavigationManager.NavigateTo() method to behave consistently on Static and Interactive render modes ie. the user would be redirected and no run-time exception would occur.

Alternatively, some official guidance from Microsoft on how to deal with this scenario in Blazor applications would be useful. For example if the expectation is that developers need to create their own wrapper class around NavigationManager.NavigateTo() to handle the exception in Static rendering, then it should be included in the documentation.

Steps To Reproduce

The code in the issue reproduces the issue... just be sure to instantiate the component in Interactive render mode.

Exceptions (if any)

No response

.NET Version

8.0.1

Anything else?

No response

[javiercn]

@sbwalker thanks for filing an issue.

This has come up in the past, and we discussed fixing it for 9.0. I don't know if we have an issue tracking it, so I'm going to choose this one as the one, but in general, we all agree that the current way this works is not great.

[sbwalker]

@javiercn I am glad we are in agreement :) In the interim (before .NET 9) is the recommendation to create a simple wrapper around NavigationManager.NavigateTo() which traps and ignores the exception when running on static render mode?

[DylanLyon]

I'm having a similar issue with the NavigationManager.NavigateTo() method. My use case is pretty simple but a lot of functionality in the app relies on being able to handle routing parameters to initialize data in the app and is no longer working as it used to.

Navigation.NavigateTo($"authentication/login?returnUrl={Uri.EscapeDataString(Navigation.Uri)}");

The idea is that in my RedirectToLogin component a non-authorized user would be redirected to a login and then directed to their URL so it can be decoded and initialized. But currently it doesn't seem that the returnUrl is working as expected. Instead of navigating to the original URL it just forgets it and navigates to the base URL of the app.

The app is newly updated for Dotnet 8 from Dotnet 6 and this seems to be the only major issue. Using package versions 8.0.2. Potentially related I found that I had to add

<TrimmerRootAssembly Include="Microsoft.AspNetCore.Components.WebAssembly.Authentication" />

to my csproj because of a different authentication redirect issue so maybe there are some issues with this package?

[sherviniv]

I encounter a similar issue whenever I run my code with a debugger. It functions properly without a debugger.
Microsoft.AspNetCore.Components.NavigationException HResult=0x80131500 Message=Exception of type 'Microsoft.AspNetCore.Components.NavigationException' was thrown. Source=Microsoft.AspNetCore.Components.Server StackTrace: at Microsoft.AspNetCore.Components.Server.Circuits.RemoteNavigationManager.NavigateToCore(String uri, NavigationOptions options) at Microsoft.AspNetCore.Components.NavigationManager.NavigateToCore(String uri, Boolean forceLoad) at RedirectToLogin.OnInitialized() in RedirectToLogin.razor:line 6 at Microsoft.AspNetCore.Components.ComponentBase.<RunInitAndSetParametersAsync>d__21.MoveNext()

[KennethHoff]

@sherviniv Are you actually encountering an issue, or simply an exception?

[sherviniv]

@KennethHoff In both cases(without a debugger or with it) it is working. But with the debugger mode, I got an exception.

[sbwalker]

@javiercn I just realized that catching and ignoring the exception in your application code is not a solution, as the NavigationManager will fail to redirect to the desired location.

Created an extension method

using Microsoft.AspNetCore.Components;

namespace Oqtane.Extensions
{
    public static class NavigationManagerExtensions
    {
        public static void NavigateToIgnoreException(this NavigationManager navigationManager, string uri, bool forceLoad = false, bool replace = false)
        {
            try
            {
                navigationManager.NavigateTo(uri, forceLoad, replace);
            }
            catch
            {
                // ignore exception thrown in static rendering within debugger
            }
        }
    }
}

and used it in my component:

NavigationManager.NavigateToIgnoreException("/");

The exception is ignored - but no navigation occurs - the existing UI will continue to be displayed.

So it seems that the only way to deal with this issue in .NET 8 is to configure the Visual Studio dev tools to ignore the exception - and then it will work as expected.

[sbwalker]

The Blazor Web template with authentication enabled includes an IdentityRedirectManager class which appears to provide a workaround for this issue (ie. so that exceptions are not thrown):

// During static rendering, NavigateTo throws a NavigationException which is handled by the framework as a redirect.
// So as long as this is called from a statically rendered Identity component, the InvalidOperationException is never thrown.

using Microsoft.AspNetCore.Components;
using System.Diagnostics.CodeAnalysis;

namespace BlazorAppWithAuth.Components.Account
{
    internal sealed class IdentityRedirectManager(NavigationManager navigationManager)
    {
        public const string StatusCookieName = "Identity.StatusMessage";

        private static readonly CookieBuilder StatusCookieBuilder = new()
        {
            SameSite = SameSiteMode.Strict,
            HttpOnly = true,
            IsEssential = true,
            MaxAge = TimeSpan.FromSeconds(5),
        };

        [DoesNotReturn]
        public void RedirectTo(string? uri)
        {
            uri ??= "";

            // Prevent open redirects.
            if (!Uri.IsWellFormedUriString(uri, UriKind.Relative))
            {
                uri = navigationManager.ToBaseRelativePath(uri);
            }

            // During static rendering, NavigateTo throws a NavigationException which is handled by the framework as a redirect.
            // So as long as this is called from a statically rendered Identity component, the InvalidOperationException is never thrown.
            navigationManager.NavigateTo(uri);
            throw new InvalidOperationException($"{nameof(IdentityRedirectManager)} can only be used during static rendering.");
        }

        [DoesNotReturn]
        public void RedirectTo(string uri, Dictionary<string, object?> queryParameters)
        {
            var uriWithoutQuery = navigationManager.ToAbsoluteUri(uri).GetLeftPart(UriPartial.Path);
            var newUri = navigationManager.GetUriWithQueryParameters(uriWithoutQuery, queryParameters);
            RedirectTo(newUri);
        }

        [DoesNotReturn]
        public void RedirectToWithStatus(string uri, string message, HttpContext context)
        {
            context.Response.Cookies.Append(StatusCookieName, message, StatusCookieBuilder.Build(context));
            RedirectTo(uri);
        }

        private string CurrentPath => navigationManager.ToAbsoluteUri(navigationManager.Uri).GetLeftPart(UriPartial.Path);

        [DoesNotReturn]
        public void RedirectToCurrentPage() => RedirectTo(CurrentPath);

        [DoesNotReturn]
        public void RedirectToCurrentPageWithStatus(string message, HttpContext context)
            => RedirectToWithStatus(CurrentPath, message, context);
    }
}

[VahidN]

A RedirectTo method for the Blazor SSR without any exception!

public static class BlazorSsrRedirectManagerExtensions
{
    public static void RedirectTo(this HttpContext httpContext, string redirectionUrl)
    {
        ArgumentNullException.ThrowIfNull(httpContext);

        httpContext.Response.Headers.Append("blazor-enhanced-nav-redirect-location", redirectionUrl);
        httpContext.Response.StatusCode = 200;
    }
}

[mxmissile]

A RedirectTo method for the Blazor SSR without any exception!

public static class BlazorSsrRedirectManagerExtensions
{
    public static void RedirectTo(this HttpContext httpContext, string redirectionUrl)
    {
        ArgumentNullException.ThrowIfNull(httpContext);

        httpContext.Response.Headers.Append("blazor-enhanced-nav-redirect-location", redirectionUrl);
        httpContext.Response.StatusCode = 200;
    }
}

Doesnt work ContextAccessor.HttpContext.RedirectTo("/");

[VahidN]

Doesnt work ContextAccessor.HttpContext.RedirectTo("/");

You should define the HttpContext for a Blazor SSR page this way and call that method at the end of the processed request (it will not end the request immediately):

@code{
    [CascadingParameter] public HttpContext? HttpContext { get; set; }
}

[mxmissile]

Doesnt work ContextAccessor.HttpContext.RedirectTo("/");

You should define the HttpContext for a Blazor SSR page this way and call that method at the end of the processed request (it will not end the request immediately):

@code{
    [CascadingParameter] public HttpContext? HttpContext { get; set; }
}

Tried using the the CascadingParameter also, If I call RedirectTo in OnInitialized() it works. However if I call it in a Callback it does not work:

<EditForm FormName="AddOrder" OnValidSubmit="SubmitOrder" Model="Form">

private void SubmitOrder()
{
   Debug.WriteLine("Order Submit");
   
   HttpContext.RedirectTo("/");
}

Not sure what I am doing wrong.

[VahidN]

Not sure what I am doing wrong.

Make it an enhanced form, it will work (it's a blazor-enhanced-nav-redirect-location):

<EditForm FormName="AddOrder" OnValidSubmit="SubmitOrder" Model="InputModel" method="post" Enhance>

[mxmissile]

That worked, thank you!