Kontrol tampilan TOTP

  • Artikel

Gunakan kontrol tampilan kata sandi satu kali berbasis waktu (TOTP) untuk mengaktifkan autentikasi multifaktor menggunakan metode TOTP. Pengguna akhir perlu menggunakan aplikasi pengautentikasi yang menghasilkan kode TOTP, seperti aplikasi Microsoft Authenticator atau aplikasi pengautentikasi lainnya yang mendukung verifikasi TOTP.

Untuk mengaktifkan TOTP dalam kebijakan kustom Anda, gunakan kontrol tampilan berikut:

  • totpQrCodeControl - Merender kode QR dan tautan langsung. Saat pengguna memindai kode QR atau membuka tautan langsung, aplikasi pengautentikasi akan terbuka sehingga pengguna dapat menyelesaikan proses pendaftaran.
  • AuthenticatorAppIconControl - Merender ikon aplikasi Microsoft Authenticator dengan tautan untuk mengunduh aplikasi ke perangkat seluler pengguna.
  • AuthenticatorInfoControl - Merender pengenalan TOTP.

Cuplikan layar berikut menggambarkan halaman pendaftaran TOTP yang menunjukkan tiga kontrol tampilan.

Screenshot showing TOTP display controls enrollment flow

Cuplikan XML berikut menunjukkan tiga kontrol tampilan:

  <DisplayControls>
    <!-- Render the QR code by taking the URI (qrCodeContent) input claim and rendering it as a QR code-->
    <DisplayControl Id="totpQrCodeControl" UserInterfaceControlType="QrCodeControl">
      <InputClaims>
        <InputClaim ClaimTypeReferenceId="qrCodeContent" />
      </InputClaims>
      <DisplayClaims>
        <DisplayClaim ClaimTypeReferenceId="qrCodeContent" ControlClaimType="QrCodeContent" />
      </DisplayClaims>
    </DisplayControl>

    <!-- Render the TOTP information by taking the totpIdentifier and the secretKey input claims and rendering them in plain text-->
    <DisplayControl Id="authenticatorInfoControl" UserInterfaceControlType="AuthenticatorInfoControl">
      <InputClaims>
        <InputClaim ClaimTypeReferenceId="totpIdentifier" />
        <InputClaim ClaimTypeReferenceId="secretKey" />
      </InputClaims>
      <DisplayClaims>
        <DisplayClaim ClaimTypeReferenceId="totpIdentifier" />
        <DisplayClaim ClaimTypeReferenceId="secretKey" />
      </DisplayClaims>
    </DisplayControl>

    <!-- Render the authenticator apps icon. -->
    <DisplayControl Id="authenticatorAppIconControl" UserInterfaceControlType="AuthenticatorAppIconControl" />
  </DisplayControls>

Kontrol tampilan dirujuk dari profil teknis yang ditegaskan sendiri. Profil teknis yang ditegaskan sendiri menggunakan transformasi klaim input untuk menyiapkan klaim input qrCodeContent dan secretKey yang diperlukan.

Transformasi klaim input harus dipanggil dalam urutan berikut:

  1. CreateSecret mengklaim jenis transformasi CreateOtpSecret. Transformasi klaim membuat kunci rahasia TOTP. Kunci ini kemudian disimpan di profil pengguna di Azure Active Directory B2C, dan dibagikan dengan aplikasi pengautentikasi. Aplikasi pengautentikasi menggunakan kunci untuk menghasilkan kode TOTP yang dibutuhkan pengguna untuk melewati MFA. Kebijakan kustom Anda menggunakan kunci untuk memvalidasi kode TOTP yang diberikan oleh pengguna.
  2. CreateIssuer mengklaim jenis transformasi CreateStringClaim. Transformasi klaim membuat nama pengeluar sertifikat TOTP. Nama pengeluar sertifikat adalah nama penyewa Anda, seperti "Contoso demo".
  3. CreateUriLabel mengklaim jenis transformasi FormatStringMultipleClaims. Transformasi klaim membuat label URI TOTP. Label adalah kombinasi dari pengidentifikasi unik pengguna, seperti alamat email, dan nama pengeluar sertifikat, misalnya, Contoso demo:emily@fabrikam.com.
  4. CreateUriString mengklaim jenis transformasi BuildUri. Transformasi klaim membuat string URI TOTP. String adalah kombinasi dari label URI dan kunci rahasia, misalnya, otpauth://totp/Contoso%20demo:emily@fabrikam.com?secret=fay2lj7ynpntjgqa&issuer=Contoso+demo. Label URI ini dirender oleh kontrol tampilan dalam format kode QR dan tautan langsung.

Kode XML berikut menunjukkan profil teknis yang ditegaskan sendiri EnableOTPAuthentication dengan transformasi klaim input, klaim input, dan kontrol tampilannya.

<TechnicalProfile Id="EnableOTPAuthentication">
  <DisplayName>Sign up with Authenticator app</DisplayName>
  <Protocol Name="Proprietary" Handler="Web.TPEngine.Providers.SelfAssertedAttributeProvider, Web.TPEngine, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null" />
  <Metadata>
    <Item Key="ContentDefinitionReferenceId">api.selfasserted.totp</Item>
    <Item Key="language.button_continue">Continue</Item>
  </Metadata>
  <CryptographicKeys>
    <Key Id="issuer_secret" StorageReferenceId="B2C_1A_TokenSigningKeyContainer" />
  </CryptographicKeys>
  <InputClaimsTransformations>
    <InputClaimsTransformation ReferenceId="CreateSecret" />
    <InputClaimsTransformation ReferenceId="CreateIssuer" />
    <InputClaimsTransformation ReferenceId="CreateUriLabel" />
    <InputClaimsTransformation ReferenceId="CreateUriString" />
  </InputClaimsTransformations>
  <InputClaims>
    <InputClaim ClaimTypeReferenceId="qrCodeContent" />
    <InputClaim ClaimTypeReferenceId="secretKey" />
  </InputClaims>
  <DisplayClaims>
    <DisplayClaim DisplayControlReferenceId="authenticatorAppIconControl" />
    <DisplayClaim ClaimTypeReferenceId="QrCodeScanInstruction" />
    <DisplayClaim DisplayControlReferenceId="totpQrCodeControl" />
    <DisplayClaim DisplayControlReferenceId="authenticatorInfoControl" />
  </DisplayClaims>
  <OutputClaims>
    <OutputClaim ClaimTypeReferenceId="objectId" />
    <OutputClaim ClaimTypeReferenceId="secretKey" />
  </OutputClaims>
  <UseTechnicalProfileForSessionManagement ReferenceId="SM-MFA-TOTP" />
</TechnicalProfile>

Alur verifikasi

Kode TOTP verifikasi dilakukan oleh profil teknis yang ditegaskan sendiri lainnya yang menggunakan klaim tampilan dan profil teknis validasi. Untuk informasi selengkapnya, lihat Menentukan profil teknis autentikasi multifaktor ID Microsoft Entra dalam kebijakan kustom Azure AD B2C.

Cuplikan layar berikut menggambarkan halaman verifikasi TOTP.

Screenshot showing TOTP display controls verification flow

Langkah berikutnya