Auth0 Home Blog Docs

How to pass language to Auth0 popup?


#1

I’m using Auth0.JS in an Angular app, and use popups to log people in. Planning to customize the hosted pages, so far all good.
I need to localize the popup. The default code of the popup checks for a parameter dict and passes that as language parameter to the Lock widget that’s show in the popup.
How do I pass that dict or language parameter from my Angular code? Can’t seem to find any parameter that I can set; refer to the source code from line 144: https://auth0.github.io/auth0.js/web-auth_popup.js.html


#2

The only option I see is to hijack popup.preload (line 49) and pass a custom parameter there?


#3

:wave: @roland I’m not sure if I understood correctly, but are you currently using Hosted Login with popup? If so, Lock has a configuration option for language, and/or can alter text through the languageDictionary. so if you are using Hosted Pages, you can configure this from your dashboard, or pass the option when you instantiate your Lock. Please let me know if this is what you are trying to do!


#4

hi @kim.noel thank you for your reply! We’re using Hosted Pages and the Auth0.JS SDK.

Pass the option when you instantiate your lock

I’m not using Lock; only the Auth0.JS SDK, and can’t find a way to pass the parameter during instantiation or when opening popup?


#5

I was able to specify my language as french for example:

webAuth.popup.authorize({
    ...
    ui_locales: 'fr' 
},

and then in your hosted pages

= new Auth0Lock(config.clientID, config.auth0Domain, {
    ...,
    language: config.extraParams.ui_locales,
    ...
}

We change change the language by using the language configuration option, where we pull the corresponding language file from the i18n directory. Also, here is a whitelist of the OAuth2 parameters we can pass in the authentication request.

Would this achieve what you are looking to do?