config for hosted login page

Help
1

I am aware of config.extraParams which is great, but the default hosted page seems to have options to configure allowedConnections, rememberLastLogin and prefill. I just don’t know how to get those parameters to the page. They are extracted from the @@config@@ object as connection, prompt and login_hint but setting those in the query parameter string doesn’t work. Is it possible, or do I need to customize the page and go through extraParams?

2

Using the Hosted Login Page, only some authorized parameters are permitted, which will be populated in the config.extraParams. You can check the full list of permitted parameters [here] (auth0.js/parameters-whitelist.js at 72bfbbb5d5e08cc5ad60eb387bd18c3824786627 · auth0/auth0.js · GitHub).

As an example, to have a prefill value, you’d have to enter a login_hint value in your authorize request as:

<script src="http://cdn.auth0.com/js/auth0/9.1.0/auth0.min.js"></script>
(...)
var webAuth = new auth0.WebAuth({ (...)});
(...)
webAuth.authorize({
  login_hint: "email@example.com"
});

In the hosted login page, the value is extracted from the config.extraParams:

var loginHint = config.extraParams.login_hint;

And finally put into the prefill value of Lock:

var lock = new Auth0Lock(config.clientID, config.auth0Domain, {
(...)
  prefill: loginHint ? { email: loginHint, username: loginHint } : null,
(...)
}

You can read more about the parameters on the /authorize endpoint here: Auth0 Universal Login

1 Like
3

Thank you for that.

I am now using extraParams to perform additional configuration of the hosted login page like the logo and theme color. I do this by adding parameters to the query-string (I am not using the SDK, I make a get request manually). This works but I am worried that Auth0 might suddenly block my additional parameters because they are not OIDC-compliant. Does anyone know if this is something I should be concerned about?

3 Likes