Chat now with support
Chat with Support

Identity Manager 9.2.1 - HTML5 Development Guide

Compiling and deploying Angular projects

To make an Angular project available, you must compile the Angular project and compress it into a ZIP file.

To compile and deploy an Angular project using the API Server

  1. Start a command line program.

  2. Change to the Angular workspace directory.

  3. Run the following command:

    ng build <project name>

  4. Change to the directory with the compilation (normally dist/<projectname>) and add all the files and subfolders to a new ZIP file with the name Html_<projectname>.zip.

  5. Copy the ZIP file to the imxweb\custom subfolder of your workspace.

    TIP: If the folder does not exist, create it.

  6. Import the ZIP file into your One Identity Manager database using the Software Loader and assign it to the Development and Testing machine role. For more information on importing files using the Software Loader, see the One Identity Manager Operational Guide.

  7. Copy the ZIP file to the bin\imxweb\custom subfolder of your IIS installation.

    TIP: If the folder does not exist, create it.

  8. Import the ZIP file into your One Identity Manager database using the Software Loader and assign it to the Business API Server machine role.

  9. (Optional) To check whether your Angular package (and therefore your HTML application) is loaded correctly, check that the corresponding packages are labeled as Customized package in the Administration Portal. For more information about displaying packages, see the One Identity Manager Web Application Configuration Guide.

To compile and deploy an Angular project without using the API Server

  1. Use the Software Loader program to export the API Server file structure from your One Identity Manager database to a local folder. Select the Server, Web, Business API Server, and SCIM Provider machine roles. For more information on exporting files with the Software Loader, see the One Identity Manager Operational Guide.

  2. Start a command line program.

  3. Change to the Angular workspace directory.

  4. Run the following command:

    ng build <project name>

  5. Change to the directory with the compilation (normally dist/<projectname>) and add all the files and subfolders to a new ZIP file with the name Html_<projectname>.zip.

  6. Copy the ZIP file to the imxweb\custom subfolder of your workspace.

    TIP: If the folder does not exist, create it.

  7. Import the ZIP file into your One Identity Manager database using the Software Loader and assign it to the Development and Testing machine role. For more information on importing files using the Software Loader, see the One Identity Manager Operational Guide.

  8. Copy the ZIP file to the bin\imxweb\custom subfolder of the folder created in the first step.

    TIP: If the folder does not exist, create it.

  9. Import the ZIP file into your One Identity Manager database using the Software Loader and assign it to the Business API Server machine role.

  10. (Optional) To check whether your Angular package (and therefore your HTML application) is loaded correctly, check that the corresponding packages are labeled as Customized package in the Administration Portal. For more information about displaying packages, see the One Identity Manager Web Application Configuration Guide.

Debugging

Running and debugging HTML applications is possible with the Angular CLI toolchain's standard tools.

For example, you can use the ng serve qer-app-portal command to debug the Web Portal HTML application.

To debug an HTML application

  1. Host the API Server locally (see Hosting API Servers locally).

  2. Start a command line program.

  3. Change to the Angular workspace directory.

  4. Run the following command:

    npm run start <HTML application>

    This starts a web server that is accessible by default under http://localhost:4200 and hosts the HTML application.

  5. Start debugging in an appropriate development environment (for example, Visual Studio Code).

Detailed information about this topic

Hosting API Servers locally

To debug and develop an HTML application you need an instance of an API Server for connecting HTML applications. To do this, you can host an API Server locally.

NOTE: HTML applications connect with the API Server through the URL defined in the HTML application's environment.ts file. The default URL that runs under a locally hosted API Server, is http://localhost:8182.

To host an API Server locally

  1. Start a command line program.

  2. Switch to the One Identity Manager installation directory.

  3. Run the following command:

    imxclient.exe run-apiserver -B

Debugging with plug-ins

You can also debug with plug-ins. Debugging with plug-ins only works if the local API Server can find the plug-in.

To debug a static Angular library

  1. Host the API Server locally (see Hosting API Servers locally).

  2. Start a command line program.

  3. Change to the Angular workspace directory.

  4. Run the following command:

    npm run build:watch <Angular library>

  5. Start another command line program.

  6. Change to the Angular workspace directory.

  7. Run the following command:

    npm run start <HTML application>

    This starts a web server that is accessible by default under http://localhost:4200 and hosts the HTML application.

  8. Start debugging in an appropriate development environment (for example, Visual Studio Code).

To debug an Angular plug-in library

  1. Host the API Server locally (see Hosting API Servers locally).

  2. Start a command line program.

  3. Change to the Angular workspace directory.

  4. Run the following command:

    npm run build:watch:dynamic <Angular plug-in library>

  5. Start another command line program.

  6. Change to the Angular workspace directory.

  7. Run the following command:

    npm run start <HTML application>

    This starts a web server that is accessible by default under http://localhost:4200 and hosts the HTML application.

  8. Start debugging in an appropriate development environment (for example, Visual Studio Code).

Related Documents

The document was helpful.

Select Rating

I easily found the information I needed.

Select Rating