Auth0-spa-js: Redirect User to Signup page instead of Login page?

[costas90]

Hello,

I implemented the Vue.js quickstart for auth0-spa-js .

Now I want to create a Register button that redirects the user to the Sign Up page instead of the Login page.

Is it not possible? I dont see a method for doing so.

If this is not available, what is the reason?

[costas90]

I just figured this out. I used:

this.$auth.loginWithRedirect({ screen_hint: 'signup' });

[costas90]

I am trying this with the Classic Univeral Login also and it doesnt work. I tried the following with no success.

this.$auth.loginWithRedirect({ initialScreen: 'signup' });
and also
this.$auth.loginWithRedirect({ initial_screen: 'signup' });

This is according to the configuration options here https://auth0.com/docs/libraries/lock/v11/configuration#initialscreen-string-

Do I need to use the Lock for Web library also?

[stevehobbsdev]

@costas90 Your usage of loginWithRedirect looks correct; what's missing is applying those parameters to your Lock configuration. This doesn't happen automatically - you have to modify the Lock template so that it picks up those parameters from the query string and configures Lock using the options that you've linked to. This customization can be done by accessing the Universal Login page in your Auth0 dashboard.

Let me know if this ☝️ helps you. I'm trying to find out if we have a nice document that explains how to customize that template in case you struggle with it.

[costas90]

Thank you I made it work thanks to this thread https://community.auth0.com/t/how-to-redirect-user-to-hosted-signup-page/9482/2

I am not sure I quite understand what is happening but it works.

For example, where can I read more about extraParams?

[stevehobbsdev]

Glad you got it working! extraParams is basically any additional parameters that are sent by your application in the /authorize call that Auth0 does not itself use. These can then be picked up by your Lock template in config.extraParams and used how you wish. This thread may help you understand more.

Let me know if that helps!

[Enngage]

I'm guessing this is no longer necessary, right? At least when using the new universal login. I've been able to use just:

client.loginWithRedirect({
     connection: connection,
     screen_hint: 'signup',
   });

See https://auth0.com/docs/universal-login/new

[stevehobbsdev]

@Enngage Yes that works fine for the new Universal Login experience. For the Classic experience with Lock, the above still applies.

[Enngage]

Ah, okey, thanks for confirmation :-) At least people using new universal login experience have a way of setting this up easily.

[derekbekoe]

Can this be included in the reference docs at https://auth0.github.io/auth0-spa-js/interfaces/redirectloginoptions.html?

It doesn't seem to be there.