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

【问题标题】：Azure B2C password field text and placeholderAzure B2C 密码字段文本和占位符
【发布时间】：2021-05-02 15:45:42
【问题描述】：

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

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

此文档Localization string IDs 提到您只能在页面布局版本“

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

政策 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>

【问题讨论】：

标签： azure azure-ad-b2c azure-ad-b2c-custom-policy

【解决方案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);
});

【讨论】：

【解决方案2】：

感谢@Luan。这是页面布局版本 2.1.0 及更高版本的已知问题，已向产品团队报告。作为一种解决方法，您能否尝试使用标准用户流，因为它支持页面布局版本 1.2.0 和更低版本。让我们知道问题是否仍然存在于较低版本中。

【讨论】：