SSO-injectie op webapplicaties configureren met het hulpmiddel CyberElements SSO Configurator¶

Vandaag de dag wordt de configuratie van SSO (Single Sign-On) op webapplicaties geconfronteerd met een toenemende verscheidenheid en complexiteit van de aanmeldformulieren, waardoor de configuratie bij het aanmaken van de webapplicatie in de console handmatig moet worden ingesteld.

Om deze beperking te ondervangen heeft ons team de extensie CyberElements SSO Configurator ontwikkeld, waarmee de configuratie van de aanmeldpagina eenvoudig kan worden opgehaald.

De extensie installeren¶

De extensie CyberElements SSO Configurator is compatibel met op Chromium gebaseerde browsers (Google Chrome, Opera GX, Microsoft Edge enz.) en met Firefox.

Op Chromium gebaseerde browsersFirefox

Download het .zip-archief uit de Toolbox van de beheerconsole en pak het uit.

Ga naar de module voor het beheer van de extensies.
Klik op de knop ”Load unpacked extension”.

Informatie

Als de knop ”Load unpacked extension” niet zichtbaar is, controleer dan of de ontwikkelaarsmodus is ingeschakeld.

Selecteer de uitgepakte map.
Klik op de knop ”Add” in het pop-upvenster dat in de browser verschijnt.
De extensie is aan uw browser toegevoegd.

Download het .xpi-bestand uit de Toolbox van de beheerconsole.

Open dit bestand door te dubbelklikken op het gedownloade bestand.
Er wordt een Firefox-venster geopend en er verschijnt een pop-upvenster met de vraag of u de extensie wilt toevoegen. Klik op de knop ”Add”.
De extensie is aan uw browser toegevoegd.

De web-SSO-configuratie ophalen met CyberElements SSO Configurator¶

Eenvoudig aanmeldformulier¶

Informatie

In deze sectie gebruiken we als voorbeeld een SSO-configuratie voor de site MySystancia.

Ga eerst naar het aanmeldformulier van uw webapplicatie.

Start vervolgens de extensie door op de knop te klikken.

De extensie wordt geopend in een balk aan de linkerkant van uw browser.

De extensie identificeert automatisch de velden die overeenstemmen met de gebruikersnaam, het wachtwoord en de knop ”Log in”, en markeert de betreffende velden.

Controleer of de gedetecteerde velden juist zijn en klik op de knop om de configuratie op het klembord op te slaan.

Aanmeldformulier over meerdere pagina's¶

Informatie

In deze sectie gebruiken we als voorbeeld een SSO-configuratie voor de applicatie Microsoft Outlook.

De aanmeldformulieren van de webapplicaties van Microsoft zijn complexer en zijn over meerdere pagina's verspreid. De door de extensie CyberElements SSO Configurator gedetecteerde configuratie moet daarom worden aangepast.

Ga eerst naar het aanmeldformulier van uw webapplicatie.

Start vervolgens de extensie door op de knop te klikken.

De extensie wordt geopend in een balk aan de linkerkant van uw browser.

De extensie identificeert automatisch de velden die overeenstemmen met de gebruikersnaam, het wachtwoord en de knop ”Log in”, en markeert de betreffende velden.

In ons voorbeeld staat op de eerste pagina alleen het ID-veld.

Merk op dat de knop ”Log in” niet correct is gedetecteerd en naar de link voor het aanmaken van een account verwijst. Klik op het pictogram van de actie button en selecteer de knop ”Next”.

Aangezien de configuratie volgens hetzelfde principe als een script werkt, moet de aangemaakte actie vervolgens vóór het wachtwoordveld worden verplaatst. Versleep het toegevoegde veld naar de tweede plaats.

Voer daarna een e-mailadres in en klik op de knop ”Next” om naar de volgende pagina te gaan en het wachtwoordveld te bereiken.

Klik op de knop van de actie password en selecteer het wachtwoordveld.

Voeg vervolgens een actie toe met de knop , klik op de knop van de toegevoegde actie en selecteer de knop ”Connect”.

Klik op de knop om de configuratie op het klembord op te slaan.

Aanmeldformulier met willekeurige velden¶

Informatie

In deze sectie gebruiken we als voorbeeld een SSO-configuratie voor een applicatie op basis van GLPI.

Afhankelijk van de webapplicatie is het mogelijk dat de aanduidingen van de velden van het aanmeldformulier willekeurig worden gegenereerd en bij een nieuwe aanmelding dus niet meer overeenkomen.

Haal, om te weten of uw applicatie de aanduidingen van bepaalde velden willekeurig genereert, de configuratie van het aanmeldformulier een eerste keer op en plak deze in een tekstbestand.

Laad daarna de aanmeldpagina opnieuw en haal de configuratie van het aanmeldformulier nog een keer op. Plak deze in een ander tekstbestand.

Vergelijk vervolgens de twee configuraties:

Configuratie 1 Configuratie 2

{
  "https://glpi.domain.local/index.php": {
    "login": {
      "id": "login_name",
      "name": "fielda67a46f7296fa6",
      "type": "text",
      "value": "",
      "order": 1,
      "objectType": "input",
      "tag": "input"
    },
    "password": {
      "id": "login_password",
      "name": "fieldb67a46f7296fa9",
      "type": "password",
      "value": "",
      "order": 2,
      "objectType": "input",
      "tag": "input"
    },
    "button": {
      "id": "",
      "name": "submit",
      "type": "submit",
      "value": "",
      "order": 3,
      "objectType": "button",
      "tag": "button"
    }
  }
}

{
  "https://glpi.domain.local/index.php": {
    "login": {
      "id": "login_name",
      "name": "fieldb78b57f83a70b7",
      "type": "text",
      "value": "",
      "order": 1,
      "objectType": "input",
      "tag": "input"
    },
    "password": {
      "id": "login_password",
      "name": "fieldc79b57083a70ba",
      "type": "password",
      "value": "",
      "order": 2,
      "objectType": "input",
      "tag": "input"
    },
    "button": {
      "id": "",
      "name": "submit",
      "type": "submit",
      "value": "",
      "order": 3,
      "objectType": "button",
      "tag": "button"
    }
  }
}

Merk op dat de elementen login en password verschillende namen hebben: het gaat dus om willekeurig gegenereerde velden. Wijzig de configuratie handmatig en verwijder de aanduiding van de willekeurige velden om de configuratie te laten werken:

{
    "https://glpi.domain.local/index.php": {
        "login": {
            "id": "login_name",
            "name": "",
            "type": "text",
            "value": "",
            "order": 1,
            "objectType": "input",
            "tag": "input"
        },
        "password": {
            "id": "login_password",
            "name": "",
            "type": "password",
            "value": "",
            "order": 2,
            "objectType": "input",
            "tag": "input"
        },
        "button": {
            "id": "",
            "name": "submit",
            "type": "submit",
            "value": "",
            "order": 3,
            "objectType": "button",
            "tag": "button"
        }
    }
}

De applicatie in CyberElements aanmaken¶

Schakel bij het aanmaken van de webapplicatie in de console CyberElements SSO in voor de applicatie door in het vervolgkeuzemenu de optie ”Enabled”, ”Request” of ”Fixed” te selecteren.

Vink daarna het selectievakje ”SSO on classic HTML forms” aan.

Selecteer tot slot het SSO-type ”Injection” en plak de in de vorige sectie opgehaalde configuratie in het veld ”Injection settings”.

SSO is nu geconfigureerd voor uw applicatie.