Overview
This article explains how to determine the language using the value of the ui_locales parameter sent to the Authorization Request endpoint.
Applies To
- auth0/nextjs-auth0 SDK
- Universal Login
Solution
According to Universal Login Internationalization in Auth0’s documentation:
“The value of the ui_locales parameter sent to the Authorization Request endpoint can be used to constrain the language list for an application or session.”
To configure the Universal Login UI language based on the user’s language preference in the Next.js app using the @auth0/nextjs-auth0 SDK, it must be passed the ui_locales parameter in the loginOptions when calling the handleAuth() method. This parameter should match the language tag that corresponds to the language selected by the end user in the application.
For example:
import { handleAuth } from '@auth0/nextjs-auth0/client';
const login = async () => {
const userLanguage = 'en'; // Get user's language from your app state
await handleAuth({
loginOptions: {
ui_locales: userLanguage
}
});
}
By passing ui_locales in the loginOptions, the Universal Login page will render in the specified language. This overrides the language detected from the Accept-Language HTTP header.