Azure B2C 密码字段文本和占位符

Question

我为登录页面流程选择了 pt-Br 语言自定义，但某些元素未正确翻译(或未翻译)，然后我上传了一个覆盖文件，其中电子邮件声明显示名称有效，但密码字段 (requiredField_password ) 不尊重被覆盖的值。

阅读有关 Microsoft 文档的更多信息，我无法在 Customize the user interface in Azure Active Directory B2C 中找到任何有关更改密码占位符/文本的引用。 , Language customization in Azure Active Directory B2C .

此文档 Localization string IDs ，提到您只能在页面布局版本“< 2.0.0”上替换 requiredField_password 值，但我正在使用新版本 2.1.1。

最大的问题是，是否无法将密码字段占位符/文本更改为英语以外的语言？

策略 XML(缩写)

<Localization Enabled="true">
  <SupportedLanguages DefaultLanguage="pt-BR" MergeBehavior="ReplaceAll">
    <SupportedLanguage>pt-BR</SupportedLanguage>
  </SupportedLanguages>
  <LocalizedResources Id="api.signin.pt-BR.rp">
    <LocalizedStrings>
      <LocalizedString ElementType="ClaimType" ElementId="email" StringId="DisplayName">Email</LocalizedString>
      <LocalizedString ElementType="ClaimType" ElementId="email" StringId="UserHelpText">Email que pode ser usado para entrar em contato com você.</LocalizedString>
      <LocalizedString ElementType="UxElement" StringId="requiredField_password">Senha</LocalizedString>
    </LocalizedStrings>
  </LocalizedResources>
</Localization>

Answer 1

我只能通过自定义策略中的 JavaScript 来实现此目的。我使用的是布局版本 2.1.2。我使用我想要的语言创建了一个 JSON 对象，然后创建了我想要更改的 ID 的翻译。我在下面发布了一个示例。

需要注意的是，您必须使用更高的布局版本才能使用 JS，因此请注意这一点。

您还可以通过用户流程中的自定义 UI 使用 JS，而不仅仅是自定义策略，因此希望这对您来说是一个选择。

翻译示例:

// Get the language from the browser
var language = (navigator.languages
                ? navigator.languages[0]
                : (navigator.language || navigator.userLanguage)).toLowerCase();

// create an object with the translations and languages you want to translate to
var translations = {
    "en-us": {
        "password": "Password"
    },
    "en": {
        "password": "Password"
    },
    "fr-ca": {
        "password": "Mot de passe"
    },
    "fr": {
        "password": "Mot de passe"
    },
    "pt-br": {
        "password": "Senha"
    }
};


var passwordText = "Password";
if (language in translations) {
    passwordText = translations[language]["password"];
}

// now replace the text with the translation
$("#password").ready(function() {
    $("#password").attr("placeholder", passwordText);
});

$("label[for=\"password\"").ready(function() {
    $("label[for=\"password\"").text(passwordText);
});