Chat now with support
Chat mit Support

Identity Manager 9.3 - HTML5-Entwicklungshandbuch

HTML-Anwendungen kompilieren und bereitstellen

Um eine HTML-Anwendung zur Verfügung zu stellen, müssen Sie die HTML-Anwendung kompilieren und das Paket als ZIP-Datei verfügbar machen.

Um eine HTML-Anwendung über den API Server zu kompilieren und bereitzustellen

  1. Starten Sie ein Kommandozeilenprogramm.

  2. Wechseln Sie in das Verzeichnis des Angular-Workspace.

  3. Kompilieren Sie alle Bibliotheken, die von der HTML-Anwendung geladen werden.

    Falls Sie Nx einsetzen, führen Sie dazu den folgenden Befehl aus:

    npx build <Anwendungsname>

    HINWEIS: Angular-Bibliotheken müssen nicht gesondert bereitgestellt werden. HTML-Anwendungen enthalten alle benötigten Bibliotheken.

  4. Führen Sie den folgenden Befehl aus:

    ng build <Anwendungsname>

  5. Wechseln Sie in das Verzeichnis mit dem Kompilat (üblicherweise dist/<Anwendungsname>) und fügen Sie alle Dateien und Unterordner einer neuen ZIP-Datei mit dem Namen Html_<Anwendungsname>.zip hinzu.

  6. Kopieren Sie die ZIP-Datei in den Unterordner imxweb\custom Ihrer Arbeitsumgebung.

    TIPP: Sollte der Ordner noch nicht existieren, erstellen Sie ihn.

  7. Importieren Sie die ZIP-Datei mithilfe des Programms Software Loader in Ihre One Identity Manager-Datenbank und weisen Sie sie der Maschinenrolle Development and Testing zu. Weitere Informationen zum Importieren von Dateien mit dem Software Loader finden Sie im One Identity Manager Administrationshandbuch für betriebsunterstützende Aufgaben.

  8. Kopieren Sie die ZIP-Datei in den Unterordner bin\imxweb\custom Ihrer IIS-Installation.

    TIPP: Sollte der Ordner noch nicht existieren, erstellen Sie ihn.

  9. Importieren Sie die ZIP-Datei mithilfe des Programms Software Loader in Ihre One Identity Manager-Datenbank und weisen Sie sie der Maschinenrolle Business API Server zu.

  10. (Optional) Um zu prüfen, ob Ihr Angular-Paket (und damit Ihre HTML-Anwendung) korrekt geladen werden, prüfen Sie ob im Administrationsportal die entsprechenden Pakete mit dem Zusatz Angepasstes Paket versehen sind. Weitere Informationen zum Anzeigen der Pakete finden Sie im One Identity Manager Konfigurationshandbuch für Webanwendungen.

Um eine HTML-Anwendung ohne API Server zu kompilieren und bereitzustellen

  1. Exportieren Sie die API Server-Dateistruktur mithilfe des Programms Software Loader aus Ihrer One Identity Manager-Datenbank in einen lokalen Ordner und wählen Sie dabei die Maschinenrollen Server, Web, Business API Server und SCIM Provider. Weitere Informationen zum Exportieren von Dateien mit dem Software Loader finden Sie im One Identity Manager Administrationshandbuch für betriebsunterstützende Aufgaben.

  2. Starten Sie ein Kommandozeilenprogramm.

  3. Wechseln Sie in das Verzeichnis des Angular-Workspace.

  4. Kompilieren Sie alle Bibliotheken, die von der HTML-Anwendung geladen werden.

    Falls Sie Nx einsetzen, führen Sie dazu den folgenden Befehl aus:

    npx build <Anwendungsname>

    HINWEIS: Angular-Bibliotheken müssen nicht gesondert bereitgestellt werden. HTML-Anwendungen enthalten alle benötigten Bibliotheken.

  5. Führen Sie den folgenden Befehl aus:

    ng build <Anwendungsname>

  6. Wechseln Sie in das Verzeichnis mit dem Kompilat (üblicherweise dist/<Anwendungsname>) und fügen Sie alle Dateien und Unterordner einer neuen ZIP-Datei mit dem Namen Html_<Anwendungsname>.zip hinzu.

  7. Kopieren Sie die ZIP-Datei in den Unterordner imxweb\custom Ihrer Arbeitsumgebung.

    TIPP: Sollte der Ordner noch nicht existieren, erstellen Sie ihn.

  8. Importieren Sie die ZIP-Datei mithilfe des Programms Software Loader in Ihre One Identity Manager-Datenbank und weisen Sie sie der Maschinenrolle Development and Testing zu. Weitere Informationen zum Importieren von Dateien mit dem Software Loader finden Sie im One Identity Manager Administrationshandbuch für betriebsunterstützende Aufgaben.

  9. Kopieren Sie die ZIP-Datei in den Unterordner bin\imxweb\custom des im ersten Schritt erstellten Ordners.

    TIPP: Sollte der Ordner noch nicht existieren, erstellen Sie ihn.

  10. Importieren Sie die ZIP-Datei mithilfe des Programms Software Loader in Ihre One Identity Manager-Datenbank und weisen Sie sie der Maschinenrolle Business API Server zu.

  11. (Optional) Um zu prüfen, ob Ihr Angular-Paket (und damit Ihre HTML-Anwendung) korrekt geladen werden, prüfen Sie ob im Administrationsportal die entsprechenden Pakete mit dem Zusatz Angepasstes Paket versehen sind. Weitere Informationen zum Anzeigen der Pakete finden Sie im One Identity Manager Konfigurationshandbuch für Webanwendungen.

Debugging

Das Ausführen und Debuggen von HTML-Anwendungen ist mit den Standardwerkzeugen der Angular-CLI-Toolchain möglich.

Sie können beispielsweise den Befehl ng serve qer-app-portal verwenden, um die Web Portal-HTML-Anwendung zu debuggen.

Um eine HTML-Anwendung zu debuggen

  1. Hosten Sie den API Server lokal (siehe API Server lokal hosten).

  2. Starten Sie ein Kommandozeilenprogramm.

  3. Wechseln Sie in das Verzeichnis des Angular-Workspace.

  4. Führen Sie den folgenden Befehl aus:

    npm run start <Name der HTML-Anwendung>

    Ein Webserver, der standardmäßig unter der URL http://localhost:4200 erreichbar ist und die HTML-Anwendung hostet, wird gestartet.

  5. Starten Sie das Debugging in einer entsprechenden Entwicklungsumgebung (beispielsweise Visual Studio Code).

Detaillierte Informationen zum Thema

API Server lokal hosten

Um HTML-Anwendungen zu debuggen und zu entwickeln, benötigen Sie eine API Server-Instanz, mit der sich die HTML-Anwendungen verbinden. Für diese Zwecke können Sie einen API Server lokal hosten.

HINWEIS: Die HTML-Anwendungen verbinden sich mit dem API Server über die URL, die in der Datei environment.ts der HTML-Anwendungen definiert ist. Die Standard-URL, unter der ein lokal gehosteter API Server ausgeführt wird, ist http://localhost:8182.

Um einen API Server lokal zu hosten

  1. Starten Sie ein Kommandozeilenprogramm.

  2. Wechseln Sie in das One Identity Manager-Installationsverzeichnis.

  3. Führen Sie den folgenden Befehl aus:

    imxclient.exe run-apiserver -B

    HINWEIS: Dieses Kommando verwendet nicht die Ergebnisse einer lokalen Kompilierung aus Ihrer Entwicklungsumgebung, sondern den kompilierten Stand der HTML-Anwendungen aus der Auslieferung. Wie Sie eine HTML-Anwendung aus Ihrer lokalen Entwicklungsumgebung aufrufen, erfahren Sie unter Debugging mit Plugins.

Debugging mit Plugins

Sie können das Debugging auch mit Plugins durchführen. Das Debugging mit Plugins funktioniert nur, wenn der lokale API Server das Plugin auch finden kann.

Um eine statische Angular-Bibliothek zu debuggen

  1. Hosten Sie den API Server lokal (siehe API Server lokal hosten).

  2. Starten Sie ein Kommandozeilenprogramm.

  3. Wechseln Sie in das Verzeichnis des Angular-Workspace.

  4. Führen Sie den folgenden Befehl aus:

    npm run build:watch <Name der Angular-Bibliothek>

  5. Starten Sie ein weiteres Kommandozeilenprogramm.

  6. Wechseln Sie in das Verzeichnis des Angular-Workspace.

  7. Führen Sie den folgenden Befehl aus:

    npm run start <Name der HTML-Anwendung>

    Ein Webserver, der standardmäßig unter der URL http://localhost:4200 erreichbar ist und die HTML-Anwendung hostet, wird gestartet.

  8. Starten Sie das Debugging in einer entsprechenden Entwicklungsumgebung (beispielsweise Visual Studio Code).

Um eine Angular-Plugin-Bibliothek zu debuggen

  1. Hosten Sie den API Server lokal (siehe API Server lokal hosten).

  2. Starten Sie ein Kommandozeilenprogramm.

  3. Wechseln Sie in das Verzeichnis des Angular-Workspace.

  4. Führen Sie den folgenden Befehl aus:

    npm run build:watch:dynamic <Angular-Plugin-Bibliothek>

  5. Starten Sie ein weiteres Kommandozeilenprogramm.

  6. Wechseln Sie in das Verzeichnis des Angular-Workspace.

  7. Führen Sie den folgenden Befehl aus:

    npm run start <Name der HTML-Anwendung>

    Ein Webserver, der standardmäßig unter der URL http://localhost:4200 erreichbar ist und die HTML-Anwendung hostet, wird gestartet.

  8. Starten Sie das Debugging in einer entsprechenden Entwicklungsumgebung (beispielsweise Visual Studio Code).

Verwandte Dokumente

The document was helpful.

Bewertung auswählen

I easily found the information I needed.

Bewertung auswählen