Konfigurowanie wstrzykiwania SSO w aplikacjach internetowych za pomocą narzędzia CyberElements SSO Configurator¶

Konfigurowanie SSO (Single Sign-On) w aplikacjach internetowych napotyka dziś na rosnącą różnorodność i złożoność formularzy logowania, co oznacza, że konfigurację trzeba wykonać ręcznie przy tworzeniu aplikacji internetowej w konsoli.

Aby przełamać to ograniczenie, nasz zespół opracował rozszerzenie CyberElements SSO Configurator, które pozwala łatwo odczytać konfigurację ze strony logowania.

Instalowanie rozszerzenia¶

Rozszerzenie CyberElements SSO Configurator jest zgodne z przeglądarkami opartymi na Chromium (Google Chrome, Opera GX, Microsoft Edge itd.) oraz z Firefoksem.

Przeglądarki oparte na ChromiumFirefox

Pobierz archiwum .zip z Toolbox w konsoli administracyjnej i rozpakuj je.

Przejdź do modułu zarządzania rozszerzeniami.
Kliknij przycisk „Load unpacked extension”.

Informacja

Jeśli przycisk „Load unpacked extension” nie jest widoczny, sprawdź, czy tryb dewelopera jest włączony.

Wybierz rozpakowany folder.
Kliknij przycisk „Add” w okienku, które pojawi się w przeglądarce.
Rozszerzenie zostaje dodane do twojej przeglądarki.

Pobierz plik .xpi z Toolbox w konsoli administracyjnej.

Otwórz ten plik, klikając dwukrotnie pobrany plik.
Otworzy się okno Firefoksa, a okienko zapyta, czy chcesz dodać rozszerzenie. Kliknij przycisk „Add”.
Rozszerzenie zostaje dodane do twojej przeglądarki.

Odczytywanie konfiguracji Web SSO za pomocą CyberElements SSO Configurator¶

Prosty formularz logowania¶

Informacja

W tej sekcji jako przykład posłuży konfiguracja SSO dla witryny MySystancia.

Zacznij od przejścia do formularza logowania swojej aplikacji internetowej.

Następnie uruchom rozszerzenie, klikając przycisk .

Rozszerzenie otwiera się w panelu po lewej stronie twojej przeglądarki.

Rozszerzenie automatycznie rozpoznaje pola odpowiadające nazwie użytkownika, hasłu i przyciskowi „Log in” oraz wyróżnia odpowiednie pola.

Sprawdź, czy wykryte pola są prawidłowe, i kliknij przycisk , aby zapisać konfigurację w schowku.

Formularz logowania na wielu stronach¶

Informacja

W tej sekcji jako przykład posłuży konfiguracja SSO dla aplikacji Microsoft Outlook.

Formularze logowania aplikacji internetowych Microsoftu są bardziej złożone i rozłożone na kilka stron. Trzeba więc dostosować konfigurację wykrytą przez rozszerzenie CyberElements SSO Configurator.

Zacznij od przejścia do formularza logowania swojej aplikacji internetowej.

Następnie uruchom rozszerzenie, klikając przycisk .

Rozszerzenie otwiera się w panelu po lewej stronie twojej przeglądarki.

Rozszerzenie automatycznie rozpoznaje pola odpowiadające nazwie użytkownika, hasłu i przyciskowi „Log in” oraz wyróżnia odpowiednie pola.

W naszym przykładzie na pierwszej stronie jest obecne tylko pole identyfikatora.

Zwróć uwagę, że przycisk „Log in” nie został prawidłowo wykryty i wskazuje odnośnik tworzenia konta. Kliknij ikonę akcji button i wybierz przycisk „Next”.

Ponieważ konfiguracja działa na tej samej zasadzie co skrypt, utworzoną akcję trzeba następnie przenieść przed pole hasła. Przeciągnij i umieść dodane pole na drugiej pozycji.

Następnie wprowadź adres e-mail i kliknij przycisk „Next”, aby przejść do następnej strony i uzyskać dostęp do pola hasła.

Kliknij przycisk akcji password i wybierz pole hasła.

Następnie dodaj akcję za pomocą przycisku , kliknij przycisk dodanej akcji i wybierz przycisk „Connect”.

Kliknij przycisk , aby zapisać konfigurację w schowku.

Formularz logowania z losowymi polami¶

Informacja

W tej sekcji jako przykład posłuży konfiguracja SSO dla aplikacji opartej na GLPI.

W zależności od aplikacji internetowej możliwe jest, że identyfikatory pól formularza logowania są generowane losowo i przy ponownym logowaniu nie będą już się zgadzać.

Aby dowiedzieć się, czy twoja aplikacja generuje losowo identyfikatory niektórych pól, odczytaj konfigurację formularza logowania jeden raz i wklej ją do pliku tekstowego.

Następnie odśwież stronę logowania i odczytaj konfigurację formularza logowania ponownie. Wklej ją do innego pliku tekstowego.

Następnie porównaj obie konfiguracje:

Konfiguracja 1 Konfiguracja 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"
    }
  }
}

Zwróć uwagę, że elementy login i password mają różne nazwy, co oznacza, że są to pola generowane losowo. Aby konfiguracja działała, zmień ją ręcznie i usuń oznaczenie z losowych pól:

{
    "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"
        }
    }
}

Tworzenie aplikacji w CyberElements¶

Przy tworzeniu aplikacji internetowej w konsoli CyberElements włącz SSO dla aplikacji, wybierając z menu rozwijanego opcję „Enabled”, „Request” lub „Fixed”.

Następnie zaznacz pole „SSO on classic HTML forms”.

Na koniec wybierz typ SSO „Injection” i wklej konfigurację odczytaną w poprzedniej sekcji do pola „Injection settings”.

SSO jest teraz skonfigurowane dla twojej aplikacji.