Blazor WASM Redirect URI

I see here that return_uri is used to send a user to a page after authentication, and I have used this with success in React.

How do I do this with Blazor WASM? I have tried this with no success:

<a href="authentication/login?return_uri=/somepage">LOG IN</a>

Hey there!

Thanks for asking! Maybe our Blazor Genius @andrea.chiarelli will be able to help on that front! Thank you!

1 Like

Hey @nexusrob,
Maybe the parameter you are talking about is redirect_uri, not return_uri. See here for more details about this parameter.

This is the standard OAuth2 parameter that you should use when talking directly to the authorization server, i.e. your Auth0 tenant in this case.

If your Blazor WASM application follows the architecture I discussed in this article, the authentication/login endpoint is not an authentication server (i.e. Auth0) endpoint. It’s the endpoint of a page in your application (specifically, Client/Pages/Authentication.razor).

So, the redirect_uri parameter is ignored. The page relies on the default behavior of the <RemoteAuthenticatorView> component to interact with the authorization server. In this case, you have to use the returnUrl parameter with a fully qualified URL.

In other words, your link should look like the following:

<a href="authentication/login?returnUrl=https%3A%2F%2Flocalhost%3A7291%2Fsomepage">LOG IN</a>

Take a look at Blazor documentation for more details.

1 Like

Hi @andrea.chiarelli

I did indeed follow your article and I do have Authentication.razor. I have also changed my anchor tag to use returnUrl, but I still end up on my home page after authentication completes.

I tried this for the anchor tag

<a href="authentication/login?returnUrl=https%3A%2F%2Fwww.google.com">LOG IN</a>

When I land on the google account selection page, the URL contains

redirect_uri=https%3A%2F%2F<<MYAUTHORITY>>%2Flogin%2Fcallback

regardless of what is in the returnUrl parameter I set

Do I maybe need to add something to the authentication component in order to handle the redirect in a custom manner?

Hey @nexusrob,
You can’t just use any URL as a returnUrl. It must have the same origin as your application.
Also, if you put Google’s home page as the value for returnUrl, the login process shouldn’t even start, so I don’t understand when you say “When I land on the google account selection page…” :thinking:

Taking my sample project as our reference, the only change you need to make is related to AccessControl.razor. It should have the following highlighted line:

//... other stuff...

<AuthorizeView>
    <Authorized>
        Hello, @context.User.Identity.Name!
        <a href="#" @onclick="BeginSignOut">Log out</a>
    </Authorized>
    <NotAuthorized>
👉👉👉   <a href="authentication/login?returnUrl=https%3A%2F%2Flocalhost%3A7291%2FquizViewer">Log in</a>
    </NotAuthorized>
</AuthorizeView>

// ...other stuf...

Please, download a copy of the project and apply the change to make a test. I tried and it works correctly.

1 Like

I just put google.com as I didnt want to post my Auth0 audience URL on here.

By “When I land on the google account selection page…” what I mean is when I click the login link, it goes to Auth0 fine, I choose “log in with Google”, it then takes me to my Google account selection screen, and it has

redirect_uri=https%3A%2F%2F<<MYAUTHORITY>>%2Flogin%2Fcallback

in the URL, even though my anchor tag is like this

<a href="authentication/login?returnUrl=https%3A%2F%2Fwww.nexusbet.co.uk%2Foffers">LOG IN</a>

Then after authentication I end up on my home page.

So I can’t see what I have missed as it seems to match the samples and article.

Sorry for this. Unfortunately, I can’t figure out what’s happening. As far as I know, it should be working

1 Like

I found the solution; the ReturnUrl needs to be specified on the initial redirect, and using NavigateToLogin.

InteractiveRequestOptions requestOptions = new()
{
    Interaction = InteractionType.SignIn,
    ReturnUrl = "/my-page",
};

navManager.NavigateToLogin("authentication/login", requestOptions);
1 Like

Woooohooo! Perfect! Thanks for sharing it with the rest of community!

1 Like

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.