options transmis au constructeur. Ces options peuvent modifier le comportement du widget Lock, la façon dont il gère les connexions, les champs d’inscription supplémentaires requis pour votre projet, ainsi que la langue, les textes, les couleurs et les images du widget, et bien plus encore. Consultez la liste ci-dessous si vous savez ce que vous cherchez, ou parcourez les options pour obtenir plus de détails.
Interface utilisateur
Thème
theme de l’objet options.
Authentification
auth de l’objet options.
Database
Enterprise
Passwordless
Autres
Options de l’interface UI
allowAutocomplete
<input autocomplete />). La valeur par défaut est false.
allowAutocomplete: true
allowPasswordAutocomplete
<input autocomplete />). La valeur par défaut est false.
Réglez allowPasswordAutocomplete à true pour assurer la prise en charge des gestionnaires de mots de passe et éviter d’autres comportements indésirables.
allowPasswordAutocomplete: true
allowShowPassword
false.
allowShowPassword: true
Lock avec allowShowPassword défini à true et la case cochée pour afficher le mot de passe :

allowedConnections
signin|signup|reset. Par défaut, toutes les connexions activées sont utilisées.
allowedConnections: ['Username-Password-Authentication']
allowedConnections: ['twitter', 'facebook', 'linkedin']
allowedConnections: ['qraftlabs.com']
Exemples de allowedConnections :


autoclose
closable, il ne se fermera pas, même si cette option est définie sur vrai.
autoclose: true
autofocus
true, le focus est placé sur le premier champ du widget. La valeur par défaut est false lors de l’affichage sur un appareil mobile, ou si une option container est fournie; dans tous les autres cas, la valeur par défaut est true.
autofocus: false
avatar
avatar.
null.
avatar: null
Comportement par défaut avec Gravatar :

closable
container est fournie, sa valeur est toujours false; sinon, la valeur par défaut est true.
closable: false

container
id de l’élément HTML dans lequel le widget sera affiché.
Le widget s’affiche alors directement dans votre div, plutôt que dans une fenêtre modale.

message flash
error ou success lorsque Lock s’affiche. Cet objet possède les propriétés suivantes :
- type {String}: Le type de message; les types pris en charge sont
error,infoetsuccess - text {String}: Le texte à afficher.
language
language: 'es'

languageDictionary
languageDictionary que cet object permet de modifier.

languageDictionary.
popupOptions
window.open. Ceci s’applique uniquement si redirect est défini sur false.
rememberLastLogin
true. Cette information provient de la session Auth0 de l’utilisateur; cette fonctionnalité reste donc disponible aussi longtemps que dure sa session Auth0 (ce qui est configurable).
rememberLastLogin: false
Les nouveaux tenants ont automatiquement Seamless SSO activé. Lorsque cette option est activée, l’option rememberLastLogin n’est plus pertinente, car s’il existe déjà une session, la page ne s’affichera pas du tout. L’utilisation de Seamless SSO est fortement recommandée, car elle offre une expérience d’authentification fluide : les utilisateurs se connectent une seule fois et n’ont plus à saisir de nouveau leurs informations d’identification lorsqu’ils naviguent dans les applications que vous avez créées ou dans des applications tierces. Si l’utilisateur n’est pas connecté, il sera redirigé vers l’écran de connexion, comme prévu. De plus, le message Votre dernière connexion avec ne sera pas disponible dans les circonstances suivantes :
- Vous avez utilisé Lock dans une Hosted Login Page avec une session établie au moyen de l’authentification sans mot de passe.
- Vous avez utilisé Lock dans un scénario d’embedded login où
responseType: code(indiquant l’Authorization Code Flow, qui est utilisé pour les Regular Web Apps).
scrollGlobalMessagesIntoView
globalMessage dans la zone visible de l’utilisateur. La valeur par défaut est true.
scrollGlobalMessagesIntoView: false
Options de thème
theme de l’objet options.
- displayName {Chaîne}: Le nom à afficher à la place du nom de la connexion lors de la création du libellé du bouton, par exemple
LOGIN WITH MYCONNECTIONà la connexion). - primaryColor {Chaîne}: La couleur d’arrière-plan du bouton. La valeur par défaut est
#eb5424. - foregroundColor {Chaîne}: La couleur du texte du bouton. La valeur par défaut est
#FFFFFF. - icon {Chaîne}: L’URL de l’icône pour cette connexion. Par exemple :
http://site.com/logo.png.
true par défaut. Lorsqu’elle est définie à false, une icône s’affiche à la place.

logo
logo est l’URL d’une image qui sera affichée dans l’en-tête de Lock; par défaut, le logo d’Auth0 est utilisé. Une hauteur maximale de 58px est recommandée pour une meilleure expérience utilisateur.

La propriété
primaryColor définit la couleur principale de Lock; toutes les couleurs utilisées dans le widget en seront dérivées. Cette option est utile lorsque vous fournissez un logo personnalisé, afin de vous assurer que toutes les couleurs s’harmonisent bien avec la palette du logo. La valeur par défaut est #ea5323.

Options d’authentification
auth de l’objet options.
Le scope utilisé par défaut par Lock est openid profile email.
audience
audience indique l’API qui utilisera le reçu après l’authentification.
autoParseHash
autoParseHash est défini sur true, Lock analysera la chaîne window.location.hash au moment de son instanciation. S’il est défini sur false, vous devrez reprendre manuellement le processus d’authentification à l’aide de la méthode resumeAuth.
connectionScopes
params
state dont la valeur est foo, ainsi qu’un paramètre scope (qui comprend la portée, puis les attributs demandés).
redirect
redirectUrl
redirectUrl est fourni (c’est-à-dire défini sur une valeur non vide), l’option responseType prendra par défaut la valeur code si elle n’est pas définie manuellement.
responseMode
"form_post" si vous souhaitez que le code ou le jeton soit transmis au redirectUrl au moyen d’une requête HTTP POST, plutôt que d’être inclus dans les paramètres de requête ou le fragment de celle-ci.
Sinon, cette option ne doit pas être indiquée, et elle est omise par défaut.
responseType
responseType doit être réglée à “token” pour les applications monopages, et à “code” dans les autres cas. Par défaut, la valeur est “code” lorsque redirectUrl est fourni, et “token” sinon.
responseType est défini sur code, Lock n’affichera jamais le message Votre dernière connexion avec, et demandera toujours à l’utilisateur de saisir ses identifiants.
sso
Options Database
additionalSignUpFields
additionalSignUpFields. Chaque option ajoutée de cette façon est ensuite ajoutée au user_metadata de l’utilisateur. Pour en savoir plus, consultez Comprendre le fonctionnement des métadonnées dans les profils utilisateur. Chaque champ doit avoir un name et un placeholder, et une URL d’icon peut aussi être fournie. De plus, une valeur initiale peut être fournie avec l’option prefill, qui peut être une chaîne contenant la valeur ou une fonction qui l’obtient. Les autres options dépendent du type de champ, qui est défini à l’aide de l’option type et dont la valeur par défaut est “text”.
Option additionalSignUpFields destinée uniquement à l’inscription par base de données
Les
additionalSignUpFields sont destinés à être utilisés uniquement avec les inscriptions par base de données. Si vous avez aussi des inscriptions sociales, vous pouvez demander les renseignements supplémentaires après l’inscription des utilisateurs (consultez cette page sur l’inscription personnalisée pour en savoir plus). Vous pouvez utiliser la clé i18n databaseAlternativeSignupInstructions pour afficher ces instructions.Champs de texte
validator.
validator, le champ de texte sera obligatoire. Si vous voulez rendre le champ de texte facultatif, utilisez un validateur qui retourne toujours true, comme ceci :
storage: 'root'. Seul un sous-ensemble de valeurs peut être stocké de cette manière. La liste des attributs qui peuvent être ajoutés à la racine de votre profil se trouve ici. Par défaut, chaque champ d’inscription supplémentaire est stocké dans l’objet user_metadata.

Champ de sélection
type: "select" vous permet d’utiliser des menus déroulants afin que l’utilisateur puisse choisir une valeur.
options pour les champs select doivent respecter le format suivant :
{label: “non empty string”, value: “non empty string”}, et au moins une option doit être définie.
Les valeurs options et prefill peuvent être fournies à l’aide d’une fonction :
Champ de case à cocher
type: "checkbox". La valeur prefill permet de définir l’état par défaut de la case à cocher (true ou false) et elle est obligatoire.
type: "hidden" vous permet d’utiliser un champ masqué avec une valeur fixe.
additionalSignUpFields dans les modèles de courriel, par exemple une option de préférence linguistique, dont la valeur pourrait ensuite servir à définir la langue des communications par courriel générées à partir de modèles.
allowLogin
false, cette option empêche le widget d’afficher l’écran de connexion. C’est utile si vous voulez utiliser le widget uniquement pour les inscriptions (les onglets de connexion et d’inscription dans l’écran d’inscription seront masqués) ou pour réinitialiser des mots de passe (le bouton de retour dans l’écran mot de passe oublié sera masqué). Dans ce cas, vous devrez peut-être aussi préciser les options initialScreen, allowForgotPassword et allowSignUp. Par défaut, cette option est définie à true.
allowLogin: false

allowForgotPassword
false, allowForgotPassword masque le lien « Vous ne vous souvenez pas de votre mot de passe? » dans l’écran de connexion, ce qui rend l’écran mot de passe oublié inaccessible. La valeur par défaut est true. Si vous utilisez une connexion à la base de données avec une base de données personnalisée qui n’a pas de script Change Password, l’écran mot de passe oublié ne sera pas disponible.
allowForgotPassword: false

allowSignUp
false, cette option masque les onglets de connexion et d’inscription sur l’écran de connexion, ce qui rend l’écran d’inscription inaccessible. Sa valeur par défaut est true. Gardez à l’esprit que si la connexion à la base de données a les inscriptions désactivées ou si vous utilisez une base de données personnalisée qui n’a pas de script Create, l’écran d’inscription ne sera pas disponible.
Gardez aussi à l’esprit que cette option contrôle uniquement l’apparence côté client et n’empêche pas complètement de nouvelles inscriptions par des visiteurs anonymes déterminés. Si vous voulez empêcher complètement les nouveaux utilisateurs de s’inscrire, vous devez utiliser l’option Disable Sign Ups dans le dashboard, dans les paramètres de la connexion.
allowSignUp: false

defaultDatabaseConnection
defaultDatabaseConnection: 'test-database'
initialScreen
login, signUp et forgotPassword. Si cette option n’est pas précisée, le widget affichera par défaut le premier écran disponible dans cette liste.
initialScreen: 'forgotPassword'
loginAfterSignUp
true.
loginAfterSignUp: false
forgotPasswordLink
forgotPasswordLink: 'https://yoursite.com/reset-password'
showTerms
true, la chaîne languageDictionary.signUpTerms s’affiche. La valeur par défaut est true.
showTerms: false
mustAcceptTerms
true, une case à cocher s’affiche à côté des conditions générales et doit être cochée avant l’inscription. Les conditions générales peuvent être définies au moyen de l’option languageDictionary. Cette option ne s’applique qu’aux utilisateurs qui s’inscrivent avec des connexions à la base de données. La valeur par défaut est false.
mustAcceptTerms: true
prefill
signUpLink
allowSignUp à true.
signUpLink: 'https://yoursite.com/signup'
usernameStyle
requires_username est activé (s’il ne l’est pas, l’option usernameStyle sera ignorée). Les valeurs possibles sont "username" et "email". Par défaut, username et email sont tous deux autorisés; définir cette option limitera la connexion à l’un ou à l’autre.
usernameStyle: 'username'
Options d’entreprise
defaultEnterpriseConnection
defaultDatabaseConnection est fourni, la connexion à la base de données sera utilisée et cette option sera ignorée.
defaultEnterpriseConnection: 'test-database'
defaultADUsernameFromEmailPrefix
true.
defaultADUsernameFromEmailPrefix: false
Options Passwordless
passwordlessMethod
Auth0LockPasswordless avec une connexion par courriel, vous pouvez utiliser cette option pour choisir entre l’envoi d’un code ou d’un lien magique pour authentifier l’utilisateur. Les valeurs possibles pour les connexions par courriel sont code et link. La valeur par défaut est code. Les connexions SMS utiliseront toujours code.
passwordlessMethod: code
Autres options
configurationBaseUrl
configurationBaseUrl: "https://www.example.com"
languageBaseUrl
https://cdn.auth0.com, puisque c’est là que sont stockées toutes les traductions fournies. En indiquant une autre valeur, vous pouvez utiliser une autre source pour les traductions de langue, au besoin.
languageBaseUrl: "https://www.example.com"
hashCleanup
hashCleanup est activée, elle supprime la partie hachage de l’URL de rappel après l’authentification de l’utilisateur. La valeur par défaut est true.
hashCleanup: false
connectionResolver
username, context et callback comme paramètres. Le callback attend un objet comme : {type: 'database', name: 'connection name'}. Cela fonctionne uniquement avec les connexions à la base de données. Gardez à l’esprit que ce résolveur s’exécute lors de l’événement onSubmit du formulaire, alors gardez-le simple et rapide.
Cette fonctionnalité est en version bêta. Si vous trouvez un bogue, veuillez ouvrir une issue sur GitHub.
leeway
leeway peut être définie comme un entier — une valeur en secondes — qui sert à tenir compte d’un décalage entre les horloges lors de l’expiration des . En général, cette valeur ne dépasse pas une ou deux minutes.
leeway: 30