Delen via


Geavanceerde aanpassing van AD FS-aanmeldingspagina's

Active Directory Federation Services (AD FS) in Windows Server 2012 R2 en hoger ondersteunt aanpassing van de gebruikersaanmeldingservaring. Voor de meeste scenario's kunt u de ingebouwde Windows PowerShell-cmdlets gebruiken om de AD FS-aanmeldingspagina's te configureren. De aanbevolen aanpak is het gebruik van de ingebouwde Windows PowerShell-opdrachten voor aanpassingen, indien mogelijk. Zie AD-FS aanpassing van gebruikersaanmeldingvoor meer informatie.

Soms moet u mogelijk een aanmeldingservaring bieden die niet kan worden ingeschakeld met behulp van de PowerShell-opdrachten die bij AD FS worden geleverd. U kunt de aanmeldingservaring configureren door aangepaste code toe te voegen aan het onload.js-bestand dat is geleverd met AD FS. De bestandscode wordt uitgevoerd op alle AD FS-pagina's.

Considerations

Bekijk de volgende belangrijke overwegingen voordat u begint met het aanpassen van AD FS-aanmeldingspagina's.

Important

Elke aanpassingswijziging die van invloed is op omleidingsstromen of protocolparameters wijzigt die door AD FS worden gebruikt, wordt niet ondersteund.

  • Het onload.js-bestand wordt uitgevoerd op alle AD FS-pagina's, inclusief formuliergebaseerde aanmeldingspagina's, detectiepagina's voor hoofdrealm, enzovoort. Zorg er altijd voor dat uw aangepaste code alleen wordt uitgevoerd zoals bedoeld en niet onverwacht.

  • AD FS wordt geleverd met een ingebouwd webthema genaamd Default. U kunt de onload.js inhoud waarmee het standaardwebthema wordt gemaakt, niet wijzigen. Als u het onload.js-bestand wilt bijwerken, maakt en gebruikt u een aangepast webthema voor AD FS-aanmeldingspagina's. Zie AD-FS aanpassing van gebruikersaanmeldingvoor meer informatie.

  • Het oorspronkelijke onload.js-bestand voor het standaardwebthema bevat ook code voor het verwerken van paginaweergaven voor verschillende formulierfactoren. De aanbevolen aanpassingsmethode is om uw aangepaste logische code toe te voegen aan het bestaande onload.js-bestand. Wijzig de oorspronkelijke onload.js bestandsinhoud niet.

  • Wanneer u verwijst naar HTML-elementen, controleert u altijd of het element bestaat voordat u op het element handelt. Deze stap biedt robuustheid en zorgt ervoor dat aangepaste logica niet wordt uitgevoerd op pagina's die dit element niet bevatten. Als u bestaande HTML-elementen wilt identificeren, bekijkt u de HTML-bron op de AANMELDINGspagina's van AD FS.

  • Het is raadzaam om uw aanpassingen in een alternatieve omgeving te valideren en tests uit te voeren voordat u uw aanpassingen naar productie AD FS-servers verplaatst. Met deze stap wordt de kans verkleind dat eindgebruikers vóór de validatie aanpassingen kunnen aanbrengen.

Aanpassingsstappen

De volgende secties bevatten de stappen voor het aanpassen van de onload.js bestandsinhoud voor AD FS-aanmeldingspagina's.

Aangepast webthema maken

Als u uw aangepaste logica wilt toevoegen aan het onload.js-bestand, moet u eerst een aangepast webthema maken. Een snelle methode is het exporteren van het standaardwebthema en vervolgens de oorspronkelijke code gebruiken als basis voor uw aanpassingen.

Voer de volgende cmdlet uit om een aangepast webthema te maken door het standaardwebthema te dupliceren:

New-AdfsWebTheme –Name custom –SourceName default

onload.js-bestand genereren

De volgende stap bestaat uit het exporteren van uw aangepaste webthema, zodat u een onload.js bestand hebt dat u kunt bijwerken.

Voer de volgende cmdlet uit om uw aangepaste webthema te exporteren en een onload.js-bestand te genereren:

Export-AdfsWebTheme –Name default –DirectoryPath c:\theme

Het onload.js-bestand wordt in de map script in de map die is opgegeven in de cmdlet geplaatst. In het voorbeeld is de opgegeven map de map c:\theme.

Aanpassingen toevoegen

U bent nu klaar om de onload.js inhoud te wijzigen en aangepaste logische code toe te voegen voor uw scenario's. Zoals vermeld, moet u uw aangepaste code toevoegen aan het einde van het onload.js-bestand.

Zie de volgende sectie Voorbeelden voor codefragmenten die algemene aanpassingen demonstreren.

Doelbestand onload.js wijzigen

Nadat u uw aanpassingen hebt toegevoegd, moet u het AD FS-webthema bijwerken om uw onload.js bestand te gebruiken in plaats van het oorspronkelijke onload.js bestand.

Voer de volgende cmdlet uit om uw onload.js-bestand in te stellen als het doel voor webthemadefinities:

  • Voor AD FS op Windows Server 2016 en hoger:

    Set-AdfsWebTheme -TargetName custom -OnLoadScriptPath "c:\theme\script\onload.js"
    
  • Voor AD FS op Windows Server 2012 R2:

    Set-AdfsWebTheme -TargetName custom -AdditionalFileResource @{Uri='/adfs/portal/script/onload.js';path="c:\theme\script\onload.js"}
    

Aanpassingen toepassen op AD FS

De laatste stap is het toepassen van uw aanpassingen op de AD FS-aanmeldingspagina's.

Voer de volgende cmdlet uit om AD FS bij te werken met uw aanpassingen:

Set-AdfsWebConfig -ActiveThemeName custom

Examples

De volgende voorbeelden bevatten aangepaste code die u kunt toevoegen aan het onload.js-bestand om AD FS-aanmeldingspagina's te configureren.

Note

Voeg altijd aangepaste code toe aan het einde van het onload.js-bestand.

Titeltekenreeks voor aanmeldingspagina wijzigen

Op de aanmeldingspagina op basis van een AD FS-formulier wordt een titel weergegeven boven de invoervelden van de gebruiker. De standaardtitelwaarde is 'Aanmelden met uw organisatieaccount'.

Vervang de standaardtekenreekswaarde door een aangepaste tekenreeks door de volgende code toe te voegen aan het bestand onload.js. Stel in de code de waarde van de parameter loginMessage.innerHTML in op de aangepaste tekenreeks die moet worden gebruikt voor de titel.

// Sample code to change page title string

// Check if loginMessage element is present
var loginMessage = document.getElementById('loginMessage');
if (loginMessage)
{
       // If loginMessage element is present, change title to custom value
       loginMessage.innerHTML = 'Custom title string value';
}

SAM-accountnaam aanmelding accepteren

De aanmeldingspagina op basis van EEN AD FS-formulier ondersteunt standaard twee aanmeldingsmethoden:

  • userPrincipalName": A user principal name (UPN), such as user@contoso.com'.
  • samAccountName: een SAM-accountnaam (Domain Qualified Security Account Manager), zoals contoso\user of contoso.com\user.

Overweeg een scenario waarin alle gebruikers zich in hetzelfde domein bevinden en de gebruikers alleen hun SAM-accountnaam kennen. U kunt de aanmeldingspagina bijwerken zodat gebruikers zich alleen kunnen aanmelden met hun SAM-accountnaam.

Schakel aanmelden vanuit SAM-accounts alleen in door de volgende code toe te voegen aan het onload.js-bestand. Stel in de code de waarde van de parameter userNameValue in op het gewenste domein.

// Sample code to enable user login from SAM account name only

if (typeof Login != 'undefined'){

    Login.submitLoginRequest = function () {
    
    var u = new InputUtil();
    var e = new LoginErrors();
    var userName = document.getElementById(Login.userNameInput);
    var password = document.getElementById(Login.passwordInput);

    // Update login method with desired domain value
    if (userName.value && !userName.value.match('[@\\\\]'))
    {
        var userNameValue = 'contoso.com\\' + userName.value;
        document.forms['loginForm'].UserName.value = userNameValue;
    }
    
    // Check for user name errors
    if (!userName.value) {
       u.setError(userName, e.userNameFormatError);
       return false;
    }

    // Check for password errors
    if (!password.value)
    {
        u.setError(password, e.passwordEmpty);
        return false;
    }

    // Update the form page 
    document.forms['loginForm'].submit();
    return false;
    };

}