How to make /connect/:provider resolve to the signup URL instead of the login URL

[JJ. Ramirez]

I'm using grant to connect Auth0 to an app, but I just noticed that connect/auth0 always resolves to a .auth0.com/u/login. Is there a way to instruct grant to redirect to auth0.com/u/signup?

I honestly didn't know where else to ask this, so please let me know if there's a better place to ask this question. Thanks in advance.

[simo]

Grant redirects you to the authorization URL: https://[subdomain].auth0.com/authorize

From there the authorization server decides where to redirect the user, in this case the login page. Maybe there is a parameter that you can pass to the authorization endpoint so that the Auth0 server redirects you to the signup page instead? If not then there is not much that you can do.

[JJ. Ramirez]

@simov Thanks. I will look into this. Will /connect/auth0 forward any query params I pass? So if I do /connect/auth0?param=true will the redirect be https://[subdomain].auth0.com/authorize?param=true ?

[simo]

In case the parameter is not listed here then you can send it as custom parameter instead, as long as the server expects it.

[JJ. Ramirez]

Thanks @simov I did try to do this in the following way:

auth0: {
    client_id: process.env.AUTH0_CLIENT_ID,
    client_secret: process.env.AUTH0_CLIENT_SECRET,
    scope: ["openid", "email", "profile"],
    subdomain: process.env.AUTH0_DOMAIN,
    custom_params: { screen_hint: "signup" }
}

but for some reason the params are never forwarded to the authorize URL. Any chance there's some bug in this logic?

Even if this worked, this still doesn't solve the problem because it seems that I can't change that custom_params at runtime to control if the authorize url should redirect to the signup or the login.

Would you consider a PR with logic that allows to forward query params passed in the /connect/:provider route to the final authorize URL? I read the source and I think it's possible.

[simo]

That's the sole purpose of the custom_params configuration, it means: custom authorization parameters to be sent to the authorization endpoint.

Every configuration option in Grant can be set dynamically in a few different ways.

With all that being said, where did you find the screen_hint: "signup" custom parameter? I'm not finding it in the Auth0's documentation.

[JJ. Ramirez]

@simov It's referenced in the universal login docs: https://auth0.com/docs/authenticate/login/auth0-universal-login/new-experience#signup

I tested manually and it does indeed work, but when setting it up on the config the custom_params are not being included in the authorize url.

Every configuration option in Grant can be set dynamically in a few different ways.

Perfect! I think my only problem then is to make the custom_params work. I really don't know how to make it work since I'm configuring it the way the documentation says, and yet I don't see the custom param in the requested authorize url. Any clue? Thanks!

[simo]

Here is what you can do:

1. Load the page on your website where the login button is
2. Open up Developer Tools and click on the Networking tab
3. Enable 'Preserve Logs'
4. Click on the login button
5. Check back the networking page and find the request being made to the /authorize endpoint
6. Click on the Headers tab and take a look at the Request URL - it contains the screen_hint=signup parameter

[JJ. Ramirez]

@simov Sorry for the late follow-up here. I was able to figure out the issue with the parameter not being passed.

However, I'm still not sure I understand how the dynamic setting works. Currently, I'm registering grant with the following configuration:

auth0: {
          key: appConfig.auth0.client_id,
          secret: appConfig.auth0.client_secret,
          callback: "/post-auth",
          scope: appConfig.auth0.scope,
          subdomain: appConfig.auth0.subdomain,
          custom_params: { screen_hint: "signup" },
          dynamic: ["custom_params"],
        },

Certainly, screen_hint=signup is being passed to the authorize URL. Now I'm trying to set that parameter dynamically via GET like it's explained here.

My expectation is that if I do connect/auth0?custom_params={"screen_hint": "none"} it would result in a verbatim rewrite of that configuration, but what I'm getting is a chain of query params that deserialize the passed value letter by letter.

So what would be the correct way of dynamically setting a custom param? The example provided in the documentation is for one of the default params and one that only accepts a string. It seems like this mechanic doesn't allow passing an object. Is there any way to set a custom_params object via a GET request?

Thanks again for all the help! I appreciate a lot your responsiveness and the value this library brings to my projects.

[simo]

In Grant I'm using the qs module for that:

Welcome to Node.js v12.22.8.
Type ".help" for more information.
> var qs = require('qs')
undefined
> qs.stringify({custom_params:{screen_hint:'none'}})
'custom_params%5Bscreen_hint%5D=none'
> qs.parse('custom_params%5Bscreen_hint%5D=none')
{ custom_params: { screen_hint: 'none' } }

In case you need to generate the querystring inside the browser then you have to either browserify the qs module or find a replacement.

[JJ. Ramirez]

@simov Thank you very much!!! I was able to finally fix this and get the outcome I wanted. I appreciate the responsiveness and the tremendous work with Grant!! 🙏

Closing the issue now.